ASP.NET MVC 中的客户端和服务器端验证

Question

在 ViewModel 中，我有几个字段的数据注释。

public class EmployeeContactInfoVM
{

[Key]
public int slNo { get; set; }

[Required]
[Display(Name = "Employee GlobalView ID *")]
[StringLength(8,MinimumLength = 8,ErrorMessage ="GV ID should be 8 digits")]
[RegularExpression(@"^[0-9]+$", ErrorMessage = "Please use Numeric data")]
public string EmployeeID { get; set; }

[Required]
[Display(Name = "First Name *")]
[RegularExpression(@"^[a-zA-Z]+[ ]*[a-zA-Z]*$", ErrorMessage = "Please use letters")]
public string FirstName { get; set; }

}

我的视图代码如下

@model EmployeeContactInformation.ViewModel.EmployeeContactInfoVM
@using EmployeeContactInformation.Classes;
@{
  ViewBag.Title = "Index";
}
@section Scripts
{
  <script src="https://www.google.com/recaptcha/api.js?render=@ViewBag.SiteKey"></script>
  <script>
      function CreateToken() {
          $.blockUI();
          grecaptcha.execute('@ViewBag.SiteKey', { action: 'homepage' }).then(function (token) {
              document.getElementById("tokenID").value = token;
              document.EmpContactFrm.submit();
      });
    }
  </script>
}

@using (Html.BeginForm("Index", "EmployeeContactInformation", FormMethod.Post, new { name ="EmpContactFrm", id = "EmpContactFrmID" }))
{
  <div class="form-horizontal" role="form">
    <hr />
    @Html.ValidationSummary(true)

    <input type="hidden" id="tokenID" name="token" />

    <div class="form-group" style="margin-bottom:5px">
        @Html.LabelFor(model => model.EmployeeID, new { @class = "col-md-2 editor-label" })
        <div class="col-md-10 inputText">
            @Html.TextBoxFor(model => model.EmployeeID, htmlAttributes: new { @title = "Employee 
            GlobalView ID should consist of 8 digits and in some countries it may start with a leading 
            zero" })
            @Html.ValidationMessageFor(model => model.EmployeeID, "", new { @class = "text-danger" })
        </div>
    </div>


    <div class="form-group">
        @Html.LabelFor(model => model.FirstName, new { @class = "editor-label col-md-2" })
        <div class="inputText col-md-10">
            @Html.TextBoxFor(model => model.FirstName)
            @Html.ValidationMessageFor(model => model.FirstName)

        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.SurName, new { @class = "editor-label col-md-2" })
        <div class="col-md-10 inputText">
            @Html.TextBoxFor(model => model.SurName)
            @Html.ValidationMessageFor(model => model.SurName)
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-10">
            <input type="button" value="Submit" class="btn btn-create btnSave" style="font-size: 
             large;font-weight: 600;padding: 10px;" />
        </div>
    </div>
}

表单在 CreateToken function ( document.EmpContactFrm.submit(); ) 中提交。

我假设所有验证都发生在客户端，因为我已包含在配置文件中。

一些验证发生在客户端，例如，如果我输入 7 位 EmployeeID，我会收到一条消息说“GV ID 应该是 8 位”。

当我在未输入必填字段的情况下提交表单时，客户端验证不起作用，控件进入操作方法。

我在代码中包含了像 if(ModelState.IsValid) 这样的服务器端验证，现在当我错过必填字段时，这将引发验证错误。

我需要在服务器端和客户端都包含验证吗？ 我假设如果我们包含 jquery 不显眼的文件和上述配置设置，则验证可以纯粹在客户端进行。

请告诉我

Answer 1

将这一行从

 @Html.ValidationSummary(true)

至

 @Html.ValidationSummary()

阅读此答案