在 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

jquery.validate.unobtrusive.js插件作用的更多相关文章

  1. ASP.NET MVC异步验证是如何工作的03,jquery.validate.unobtrusive.js是如何工作的

    在上一篇"ASP.NET MVC异步验证是如何工作的02,异步验证表单元素的创建"中了解了ASP.NET异步验证是如何创建表单元素的,本篇体验jquery.validate.uno ...

  2. 改写jquery.validate.unobtrusive.js实现气泡提示mvc错误

    个人对于这个js.css不是很擅长,所以这个气泡提醒的样式网上找了下,用了这个http://www.cnblogs.com/wifi/articles/2918950.html当中的第一种写法. 对于 ...

  3. jQuery validate 根据 asp.net MVC的验证提取简单快捷的验证方式(jquery.validate.unobtrusive.js)

    最近在学习asp.netMVC,发现其中的验证方式书写方便快捷,应用简单,易学好懂. 验证方式基于jQuery的validate 验证方式,也可以说是对jQuery validate的验证方式的扩展, ...

  4. .net MVC内置js验证 jquery.validate.unobtrusive.js重置验证操作(备忘,找了很多次了)

    (function ($) { $.validator.unobtrusive.parseDynamicContent = function (selector) { //use the normal ...

  5. MVC3.0修改jquery.validate.unobtrusive.js实现气泡提示mvc错误

    CSS部分 <style type="text/css"> .hide {display:none;} .poptip { position: absolute; to ...

  6. jquery.validate.unobtrusive.js实现气泡提示mvc错误

    改写jquery.validate.unobtrusive.js实现气泡提示mvc错误 个人对于这个js.css不是很擅长,所以这个气泡提醒的样式网上找了下,用了这个http://www.cnblog ...

  7. 360浏览器下jquery.validate.unobtrusive的日期验证问题

    今天在招聘频道(job.cnblogs.com)遭遇这样一个问题——在360浏览器下,在一个表单验证中,虽然输入了有效的日期,却总是提示日期格式错误,见下图: 而在Chrome/Safari/Fire ...

  8. MVC的验证 jquery.validate.unobtrusive

    jQuery validate 根据 asp.net MVC的验证提取简单快捷的验证方式(jquery.validate.unobtrusive.js) 2013-07-22 19:07 4568人阅 ...

  9. MVC自定义验证 jquery.validate.unobtrusive

    MVC的验证 jquery.validate.unobtrusive 阅读目录 一.应用 二.验证规则 1.一.简单规则 2.二.复杂一点的规则 3.三.再复杂一点的规则(正则) 4.四.再再复杂一点 ...

随机推荐

  1. 添加已有项目到git rep

    cd yourproject——homegit init //在当前项目目录中生成本地git管理,建立一个隐藏.git目录 git add src //添加你想用git管理的代码的目录 git com ...

  2. hdu 2160 母猪的故事(睡前随机水一发)(斐波那契数列)

    解题思路: 一只母猪生下第二头后立马被杀掉,可以这样想即,生下第二头便被杀掉,可以看成母猪数量没变 第一天 1 第二天 2 第三天 3 :第一头生第二头后杀掉还是1头,第二头再加上第二头生下的,一共三 ...

  3. LVS-DR工作原理

    我们都知道LVS有LVS-DR,LVS-NAT,LVS-TUN三种模式,其中DR模式意为Direct Routing(直接路由).对于LVS-DR,你到底了解到什么程度?本文通过一个实例场景,详细介绍 ...

  4. 复制本贴地址传给QQ/MSN好友的代码

    <input name="" onclick='copyToClipBoard()' type="button" value=" 复制本贴地址, ...

  5. System.gc()与Object.finalize()的区别

    finalize()是由JVM自动调用的,你可以用System.gc(),但JVM不一定会立刻执行,JVM感觉内存空间有限时,才会开始执行finalize(),至于新的对象创建个数和被收集个数不同是因 ...

  6. 编译安装apache-2.4.18

    apache安装时, 必须要apr和apr-util, 这两个包是必须的 当下载apache的版本过高, 如: apache-2.4.18, 那么要求的apr或apu=apr-util版本将至少在1. ...

  7. sqlite 跨数据库查询

    try { $dbh = new PDO($dbrootemp, null, null); $dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_ ...

  8. 安装 openSUSE Leap 42.1 之后要做的 8 件事

    导读 openSUSE Leap 确实是个巨大的飞跃,它允许用户运行一个和 SUSE Linux 企业版拥有同样基因的发行版.和其它系统一样,为了实现最佳的使用效果,在使用它之前需要做些优化设置. 下 ...

  9. MBProgressHUD使用

    //方式1.直接在View上show HUD = [[MBProgressHUD showHUDAddedTo:self.view animated:YES] retain]; HUD.delegat ...

  10. 他们在军训,我在搞 OI(二)

    Day 2 7:26 2016/8/25 新的一天又开始了! 走在上学的路上,抬头看看北京少有的蓝天,太阳的威力不再那么明显,甚至输给了挡住它的云朵.迎面吹来了凉爽的风,夏天的燥热,早已无影无踪. 许 ...