在 MVC 中启用客户端验证

您已经学习了如何在 MVC 教程部分实现验证。在这里，我们将启用客户端验证。

ASP.NET MVC 使用 jQuery 支持客户端验证。首先，您需要从Scripts文件夹中引用两个 JavaScript 文件，jquery.validate.unobtrusive.js（jquery.validate.min.js 和 jquery.validate.unobtrusive.min.js 是压缩文件），如下所示添加到您的布局文件中。

示例：添加 jQuery 验证脚本文件

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
<meta property="og:title" content="@ViewBag.Title - My ASP.NET Application" />
@Styles.Render("~/Content/css") 
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
     @Html.Partial("_HeaderNavBar");   
    <div className="container body-content">
        @RenderBody()
        
        <hr />
        <footer>
            <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p>
        </footer>
    </div>
    @Scripts.Render("~/bundles/jquery")
    <b>@Scripts.Render("~/Scripts/jquery.validate.min.js")
    @Scripts.Render("~/Scripts/jquery.validate.unobtrusive.min.js")</b>
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)
</body>
</html>

现在，如果它们不存在，请在 web.config 的 <appSettings> 部分添加以下两个设置。

web.config 中的应用程序设置

<appSettings>
    <add key="ClientValidationEnabled" value="true"/>
    <add key="UnobtrusiveJavaScriptEnabled" value="true"/>
</appSettings>

就是这样。您将在应用数据注解验证属性的特定文本字段的 onblur 事件上收到验证错误消息。

为特定视图启用客户端验证

您可以通过在视图页面顶部添加 Html.EnableClientValidation(true) 来仅为特定视图启用客户端验证。

Razor 语法

@{
    ViewBag.Title = "Edit";
    Layout = "~/Views/Shared/_Layout.cshtml";
    Html.EnableClientValidation(true);
}