本文转自:http://www.cnblogs.com/ahui/archive/2010/10/08/1845677.html

MVC服务器端:

1.在controller中验证用户输入,如果验证失败,执行

ModelState.AddModelError("LoginName", Resource.LoginName + Resource.WordSpace + Resource.CanNotBeBlank);

2.在View视图某一个地方放置

<%=Html.ValidationSummary()%>

JS客户端:

1.引放相应的JS文件

<script src="/Js/jquery-1.4.2.js" type="text/javascript"></script>
<script src="/Js/jquery.validate.js" type="text/javascript"></script>

2.在View视图某一个地方放置

<label id="messageBox"></label>

3.以常规的submit()方式提交,在页面最下面加入以下JS代码

 $(function() {
$("#form1").validate({
rules: {
LoginName: { required: true, regex: "^[0-9]+$" }
},
messages: {
LoginName: "<%=Resource.LoginName + Resource.WordSpace + Resource.CanNotBeBlank%>"
},
errorLabelContainer: "#messageBox",
wrapper: "li"
});
});

4.以Ajax方式提交到服务器的,JS代码要改为:

var validate = null;
var opts = {
rules: {
LoginName: { required: true, regex: "^[a-zA-Z][a-zA-Z0-9._-]{3,20}$" }
},
messages: {
LoginName: "请输入正确的登陆名"
},
errorLabelContainer: "#messageBox",
wrapper: "li"
}; function checkForm() {
var b = validate.checkForm();
validate.showErrors();
return b;
} $(function () {
validate = $("#form1").validate(opts);
}); function SaveUser() {
if (!checkForm()) {
return;
}
//...........
}

要支持regex方式的验证,请在jquery.validate.js加入:

// 正则表达式
$.validator.addMethod(
"regex",
function (value, element, regexp) {
var check = false;
var re = new RegExp(regexp);
return this.optional(element) || re.test(value);
},
"Please check your input."
);

以上代码已实现双语化提示

其它常用的验证方式有:

required, remote, minlength, maxlength, rangelength, min, max, range, email, url, date, dateISO, number, digits, creditcard, accept, equalTo等

可参见:

http://docs.jquery.com/Plugins/Validation/validate

[转]MVC+JQuery validate实现用户输入验证的更多相关文章

  1. MVC笔记2:mvc+jquery.validate.js 进行前端验证

    1.引用如下js和css 代码 <link href="@Url.Content("~/Content/Site.css")" rel="sty ...

  2. ASP.NET MVC Jquery Validate 表单验证的多种方式

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  3. [转]ASP.NET MVC Jquery Validate 表单验证的多种方式介绍

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  4. jquery.validate.js表单验证

    一.用前必备官方网站:http://bassistance.de/jquery-plugins/jquery-plugin-validation/ API: http://jquery.bassist ...

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

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

  6. 【转】jquery.validate.js表单验证

    一.用前必备官方网站:http://bassistance.de/jquery-plugins/jquery-plugin-validation/ API: http://jquery.bassist ...

  7. [转]jquery.validate.js表单验证

    原文地址:https://www.cnblogs.com/si-shaohua/p/3780321.html 一.用前必备官方网站:http://bassistance.de/jquery-plugi ...

  8. Jquery.validate.js表单验证插件的使用

    作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...

  9. 基于Jquery Validate 的表单验证

    基于Jquery Validate 的表单验证 jquery.validate.js是jquery下的一个验证插件,运用此插件我们可以很便捷的对表单元素进行格式验证. 在讲述基于Jquery Vali ...

随机推荐

  1. 「Luogu 1471」 方差

    题目背景 滚粗了的HansBug在收拾旧数学书,然而他发现了什么奇妙的东西. 题目描述 蒟蒻HansBug在一本数学书里面发现了一个神奇的数列,包含N个实数.他想算算这个数列的平均数和方差. 输入输出 ...

  2. Javascript判断两个点(经纬度)的距离,以及是否在某个区域内(经纬度字符串)

    JS计算两个点(经纬度)的距离 function getGreatCircleDistance(lat1, lng1, lat2, lng2) { var EARTH_RADIUS = 6378137 ...

  3. Xamarin如何使用终端设备的NFC功能传递卡号等信息给Web页面(Android)

    一.前提条件,App必须具有NFC权限. 二.项目中加入监控类NFCCatchActivity.cs [Activity(Label = "NFCCatch",Theme = &q ...

  4. 使用django进行发送 邮件

    我们来看一下 django发送 邮件的整个流程 第一步:例先去 网易163注册账号并激活发邮件功能 把授权码进行 开启 来到我们的项目setting中进行 一个配置: # 邮箱的配置信息 EMAIL_ ...

  5. Scala详细环境安装与配置

    https://blog.csdn.net/free356/article/details/72911898 系统为windows.安装配置Scala如下: 一,安装Scala 1,java6以上(建 ...

  6. TFS解锁命令

    tf undo  /server:http://193.100.100.29:8080/tfs/EGSS  /workspace:HY-PC;hy   $/CTCS/TSAGS_TEAM/TestHY ...

  7. select展开时 重新加载 option,ie 折叠问题 以及 chrome 没有变化问题

    这个bug是因为浏览器的渲染问题引起的 一:重新加载option的渲染处理 1:火狐能重新渲染,并且select不折叠 2:ie重新渲染,但是select收缩折叠 3:chrome直接不重新进行渲染, ...

  8. Python实现KNN算法

    Python实现Knn算法 关键词:KNN.K-近邻(KNN)算法.欧氏距离.曼哈顿距离  KNN是通过测量不同特征值之间的距离进行分类.它的的思路是:如果一个样本在特征空间中的k个最相似(即特征空间 ...

  9. SDUT OJ 数组计算机(线段树)

    学长推荐了这个博客详细的介绍了线段树的建立.查找.更新: 数组计算机 Time Limit: 1000 ms Memory Limit: 65536 KiB Submit Statistic Prob ...

  10. SDUT OJ 数据结构实验之串三:KMP应用

    数据结构实验之串三:KMP应用 Time Limit: 1000 ms Memory Limit: 65536 KiB Submit Statistic Discuss Problem Descrip ...