Предварительная проверка требуемой поля. ASP.NET MVC

Question

У меня было такое быстрое время отклика, и у меня были очень полезные комментарии к моему первому вопросу, поэтому я подумал, что я приведу еще одну проблему здесь.

В настоящее время у меня есть приложение, которое выполняет проверку. Моя проблема в том, что он показывает только обязательные поля или подтверждение формы после отправки. Тем не менее, я хочу, чтобы он показывал звездочку или протокол проверки рядом с ним до тех пор, пока не будет найден какой-либо текст или не будут выполнены требования проверки.

Поэтому, когда вы переходите в пустую форму, все обязательные поля должны иметь сообщение или звездочку, момент, когда я печатаю, или полевое требование выполняется, сообщение должно уходить.

Я могу получить его только после подачи.

Вот мои соответствующие фрагменты кода ....

Просмотр кода

@using (Html.BeginForm("Register", "Account", FormMethod.Post, new { @class = "form-horizontal", role = "form" })) 
{ 
    @Html.AntiForgeryToken() 
    <h4>Create a new account.</h4> 
    <hr /> 
    // @Html.ValidationSummary("", new { @class = "text-danger" }) 

    <div class="form-group"> 
     @Html.LabelFor(m => m.FirstName, new { @class = "col-md-2 control-label" }) 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.FirstName, new { @class = "form-control" }) 
      @Html.ValidationMessageFor(m => m.FirstName) 
     </div> 
    </div> 
} 
@section Scripts { 
    @Scripts.Render("~/bundles/jqueryval") 
} 

Controller Код

[AllowAnonymous] 
public ActionResult Register() 
{ 
    return View(); 
} 

// 
// POST: /Account/Register 
[HttpPost] 
[AllowAnonymous] 
[ValidateAntiForgeryToken] 
public async Task<ActionResult> Register(RegisterViewModel model) 
{ 
    if (ModelState.IsValid) 
    { 
     var user = new ApplicationUser { UserName = model.Email, Email = model.Email, FirstName = model.FirstName, 
     LastName = model.LastName, PhoneNumber = model.PhoneNumber}; 
     var result = await UserManager.CreateAsync(user, model.Password); 

     if (result.Succeeded) 
     { 
      await SignInManager.SignInAsync(user, isPersistent:false, rememberBrowser:false); 

      // For more information on how to enable account confirmation and password reset please visit http://go.microsoft.com/fwlink/?LinkID=320771 
      // Send an email with this link 
      // string code = await UserManager.GenerateEmailConfirmationTokenAsync(user.Id); 
      // var callbackUrl = Url.Action("ConfirmEmail", "Account", new { userId = user.Id, code = code }, protocol: Request.Url.Scheme); 
      // await UserManager.SendEmailAsync(user.Id, "Confirm your account", "Please confirm your account by clicking <a href=\"" + callbackUrl + "\">here</a>"); 

      return RedirectToAction("Index", "Home"); 
     } 
     AddErrors(result); 
    } 

    // If we got this far, something failed, redisplay form 
    return View(model); 
} 

Код Модель

public class RegisterViewModel 
{ 
    [Required] 
    public string FirstName { get; set; } 
} 

Web Config Code

 <appSettings> 
    <add key="webpages:Version" value="3.0.0.0" /> 
    <add key="webpages:Enabled" value="false" /> 
    <add key="ClientValidationEnabled" value="true" /> 
    <add key="UnobtrusiveJavaScriptEnabled" value="true" /> 
    <add key="vs:EnableBrowserLink" value="false" /> 
    </appSettings> 

Bundle Config Code

public class BundleConfig 
{ 
    // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862 
    public static void RegisterBundles(BundleCollection bundles) 
    { 
     bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
        "~/Scripts/jquery-{version}.js")); 

     bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
        "~/Scripts/jquery.validate*")); 

     // Use the development version of Modernizr to develop with and learn from. Then, when you're 
     // ready for production, use the build tool at http://modernizr.com to pick only the tests you need. 
     bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
        "~/Scripts/modernizr-*")); 

     bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
        "~/Scripts/bootstrap.js", 
        "~/Scripts/respond.js")); 

     bundles.Add(new StyleBundle("~/Content/css").Include(
        "~/Content/bootstrap.css", 
        "~/Content/site.css")); 
    } 
} 

Как вы можете сказать от контроллера есть немного больше происходит, но для простоты я хочу сосредоточиться только на одном поле, имени.

Answer 1

Вы должны использовать Ненавязчивый Valudation

1) установить с помощью NuGet:
https://www.nuget.org/packages/jQuery.Validation.Unobtrusive/ Это будет устанавливать кучу файлов JavaScript в нашем каталоге Scripts

2) Редактировать bundleConfig

public static void RegisterBundles(BundleCollection bundles) 
{ 
    bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
       "~/Scripts/jquery-{version}.js")); 

    bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
       "~/Scripts/jquery.validate*")); 
} 

3) Вам нужно будет отобразить ненавязчивые сценарии на вашей странице где-нибудь, с этим:

@Scripts.Render("~/bundles/jqueryval") 

Это должно вас начать.

Полное руководство о том, как сделать это здесь: Проверка на стороне

https://www.exceptionnotfound.net/asp-net-mvc-demystified-unobtrusive-validation/

Answer 2

Client осуществляется с помощью JQuery. Убедитесь, что у вас есть jquery и скрипты проверки, включенные в вашу страницу.

<script src=".../Scripts/jquery.validate.js"></script> 
<script src=".../Scripts/jquery.validate.unobtrusive.js"></script>