使用bootStrap-validator

转载 2015年11月19日 22:54:44

1、引入js库

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

2、自定义校验规则(写入validator-cn.js中,引入)

jQuery.extend(jQuery.validator.messages, {
	  required: "必选字段",
	  remote: "请修正该字段",
	  //email: "<span style='color:red;'>请输入正确格式的电子邮件</span>",
	  email: "请输入正确格式的电子邮件",
	  url: "请输入合法的网址",
	  date: "请输入合法的日期",
	  dateISO: "请输入合法的日期 (ISO).",
	  number: "请输入合法的数字",
	  digits: "只能输入整数",
	  creditcard: "请输入合法的信用卡号",
	  equalTo: "请再次输入相同的值",
	  accept: "请输入拥有合法后缀名的字符串",
	  maxlength: jQuery.validator.format("请输入一个 长度最多是 {0} 的字符串"),
	  minlength: jQuery.validator.format("请输入一个 长度最少是 {0} 的字符串"),
	  rangelength: jQuery.validator.format("请输入 一个长度介于 {0} 和 {1} 之间的字符串"),
	  range: jQuery.validator.format("请输入一个介于 {0} 和 {1} 之间的值"),
	  max: jQuery.validator.format("请输入一个最大为{0} 的值"),
	  min: jQuery.validator.format("请输入一个最小为{0} 的值")
});

$(function() {
	$("#registerForm").validate({
		rules : {
			userId : "required",
			email : {
				required : true,
				email : true
			},
			password : {
				required : true,
				minlength : 5
			},
			confirm_password : {
				required : true,
				minlength : 5,
				equalTo : "#password"
			}
		},
		messages : {
			userId : "<span style='color:red'>职工号不能为空</span>",
			email : {
				required : "请输入Email地址",
				email : "请输入正确的Email地址"
			},
			password : {
				required : "请输入密码",
				minlength : jQuery.format("密码不能小于{0}个字 符")
			},
			confirm_password : {
				required : "请输入确认密码",
				minlength : "确认密码不能小于5个字符",
				equalTo : "两次输入密码不一致啊,重新输一次吧"
			}
		}
	});
});

3、HTML代码

密码<input id="password" name="password" type="password" />
确认密码<input id="confirm_password" name="confirm_password" type="password" />
条件验证<input id="funcvalidate" name="funcvalidate" value="" />

相关文章推荐

bootstrap validator 使用笔记

最近做的项目,前台使用的bootstrap框架。对于前台框架来说,验证是必不可少的。对于常用的一些校验规则,如果有一个例子会更好的。虽然有提供validator的API,但是感觉不太好用。所以记录一下...

BOOTSTRAP VALIDATOR 源码下载

  • 2016-04-01 14:09
  • 488KB
  • 下载

bootstrap validator表单提交初体验 基于HTML

bootstrap validator是twitter的表单验证前端框架。

前端校验框架-Bootstrap Validator

平时如果做表单校验的时候,自己写会非常麻烦,推荐一个前端校验的框架  Bootstrap Validator 插件介绍 先上一个图:   下载地址:https://github.com/...

bootstrap 组件学习之bootstrap validator

bootstrap 组件学习之bootstrap validator 1.项目目录 1. 源码和api地址 bootstrapvalidator源码:https://github...
  • zh4000
  • zh4000
  • 2016-11-18 23:24
  • 2092

springmvc validator验证的使用

SpringMVC介绍之Validation        对于任何一个应用而言在客户端做的数据有效性验证都不是安全有效的,这时候就要求我们在开发的时候在服务端也对数据的有效性进行验证。Spri...

struts1中使用Validator插件对表单进行校验

首先搭建好struts1的开发环境,然后在struts1的配置文件struts-config中加入 <set-property property="pathnames" ...

Spring MVC使用MultiActionController搭配Validator校验表单

贴出来以告慰下午的好几个小时, 网上的一些解决办法,有的可以验证,但是不能显示errors. 因为是继承MultiActionController,所以在配置文件中就没法制定自己的command名称...

jQuery表单验证插件Validator的使用方法

from表单数据的合法性验证是个很常见的需求,jQuery提供了一个插件:jquery validate 官网下载。    若想使用需先引用jquery.validate.js,并且要在jquery...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)