jquery.validate.unobtrusive.js插件作用

在 ASP.NET MVC 中启用 Unobtrusive JavaScript 功能，可以在运行时由服务器端根据Model中设置的验证规则，自动生成客户端验证js代码（结合jquery.validate）。这很好地解决了表单验证时一次代码，两次验证（客户端+服务器端）的问题。

使用它很简单，主要操作步骤如下：

1. 在web.config增加如下设置：

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

2. 在NuGet中引用jquery.validate与jquery.validate.unobtrusive

3. 在页面中添加js引用：

<script type="text/javascript" src="/scripts/jquery.validate.min.js"></script>       
<script src="/scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>

4. 在model中添加验证规则，示例代码如下：

public class SignupUser
{
    [Required(ErrorMessageResourceName = "DefaultRequireErrorMsg", 
        ErrorMessageResourceType = typeof(Resources))]
    [DataType(DataType.EmailAddress)]
    public string Email { get; set; }
}

5. 在页面中添加表单生成代码，比如：

@using(Html.BeginForm())
{   
    @Html.LabelFor(m=>m.Email)
    @Html.TextBoxFor(m=>m.Email)
    @Html.ValidationMessageFor(m=>m.Email)           
}

 

Unobtrusive JavaScript 的好处显而易见，但是如何在MVC3使用Unobtrusive JavaScript呢？

 

1、引用相应的Javascript文件

1 2 3 4

<script src="@Url.Content("~/Scripts/jquery-1.4.1.min.js")" type="text/javascript"></script> <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script> <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

 

2、开启 Unobtrusive JavaScript

MVC3中的Web.Config文件中默认多了两个配置项

这里是一个全局设置，你可以打开或者关闭。

 

另外，你也可以在任何一个 Action 或 Controller 中执行以下代码，灵活地进行控制，来处理一些特殊的 Action 或 Controller。

1 2	HtmlHelper.ClientValidationEnabled = true; HtmlHelper.UnobtrusiveJavaScriptEnabled = true;

 

链接：http://www.cnblogs.com/dudu/archive/2012/04/27/jquery_validate_unobtrusive_focusout_focusin.html

　　　　http://www.cnblogs.com/dozer/archive/2010/11/11/Unobtrusive-JavaScript-in-ASP-NET-MVC-3.html