`
wktong
  • 浏览: 54954 次
社区版块
存档分类
最新评论

jQuery&validate验证:同名用户和字符限制。

阅读更多

工作中用到的,记录下来。新手一个,各位若有兴趣,可以留言讨论。

 

 

第一个:输入欲注册的用户名,即时验证该用户名是否存在。

 

一、JSP:

 

<form method="post" action="..." id="entpreg_stepfive">
	<label for="usercode">登录账户:</label>
	<input type="text" name="etp.userCode" id="usercode"/><span id="usercode_valid"></span>
</from>

 

二、JS:

$("#entpreg_stepfive").validate({
	rules:{
		'etp.userCode':{
			remote: {
				type: "post",
				url: "/powerSD/sdplat/etp/userCodeExist.action",
				data: {
					userCode: function() {
                            			return $("#etp.userCode").val();
					}
				},
				dataType: "html",
				dataFilter: function(data, type) {
					if (data == "true"){
						return true;
					}else{
						return false;
					}
				}
			}
		}
	},
	messages:{
		'etp.userCode':{
			remote: "用户名已被占用"
		}
	}
});
 

三、JAVA:

1)EtpManageAction.java

public void userCodeExist(){
	String sign = "false";
	String userCode = $("etp.userCode");
	if(this.getEtpManageService().userCodeExist(userCode)){ //即“2)”
		sign = "true";
	}
	super.renderText(sign); //开发框架的功能,可用“response.getWriter().print(sign)”代替
}
 

2)EtpManageServiceImpl.java

public boolean userCodeExist(String userCode){
	boolean sign = false;
	Map params = new HashMap();
	params.put("userCode", userCode);
	String userCodeS = this.ibatisDao.getString("etp-manage.findUserCodeForMap", params); //ibatis
	if(userCodeS == null){
		sign = true;
	}
	return sign;
}
 

3)sql-cust-manage.xml

<select id="findUserCodeForMap" parameterClass="hashMap" resultClass="String">
	select t.usercode
	from t_scm_cust_register t
	where t.userCode = #userCode#
</select>

 

----------------------------------------------------------------------------------------------------------------

第二个:限定用户名只可以是字母、数字和下划线

一、JSP:

<form method="post" action="..." id="entpreg_stepfive">
	<label for="usercode">登录账户:</label>
	<input type="text" name="etp.userCode" id="usercode"/><span id="usercode_valid"></span>
</from>
 

二、JS:

$(function(){
	jQuery.validator.addMethod("regex",
		function(value, element, params) {
			var exp = new RegExp(params);
			return exp.test(value);
		}, "格式错误");	
	$("#entpreg_stepfive").validate({
		rules:{
			'etp.userCode':{
				regex: "^\\w+$"
			}
		},
		messages:{
			'etp.userCode':{
				regex: "数字、字母或下划线"
			}
		}
	});
});

 

OVER!

分享到:
评论
1 楼 holeyness 2016-05-20  
很详细的例子 谢谢 :"D

相关推荐

    jQuery.validate验证

    总的来说,jQuery.validate是JavaScript开发中不可或缺的工具,它简化了表单验证的过程,提高了代码的可读性和维护性。通过深入理解和灵活运用,开发者可以创建出高效且用户友好的表单验证机制。

    jquery表单验证框架:jquery.validate.zip

    《jQuery表单验证框架——深入理解jQuery.validate》 在网页开发中,表单验证是必不可少的一环,它能确保用户输入的数据符合预期,减少服务器端的处理负担,提高用户体验。jQuery是一个广泛使用的JavaScript库,而...

    jquery validate 表单验证

    7. **错误显示**:jQuery Validate默认会显示错误消息,但你可以通过修改`errorPlacement`回调来自定义错误元素的位置。 8. **实时验证**:通过设置`onkeyup`, `onclick`, `onfocusout`等事件,可以实现输入时的...

    jquery-validate验证框架使用详解及JS文件

    本文的配套文档包括《jquery-validate验证框架使用详解.doc》和《jquery.validate.addMethod.doc》,详细解释了框架的使用和自定义方法的创建。同时,提供的`validate.js`和`jquery.validate.zip`文件包含了完整的...

    jquery.validate表单验证密码完整例子(带密码强度显示)

    首先,`jQuery Validate`的核心功能是验证用户在表单中输入的数据,确保其符合预设的验证规则。例如,我们可以设定密码必须包含字母、数字、特殊字符等要求,以提高安全性。在提供的例子中,它会检查用户输入的密码...

    jquery.validate.js表单验证.pdf

    综上所述,jquery.validate.js提供了一个非常便捷的方式来实现表单验证,通过引入相应的JS文件,并设置相应的验证规则和自定义信息,就可以轻松完成表单验证的任务。它不仅提高了开发效率,也增强了用户填写表单时的...

    jquery+validate.js+验证规则文件

    14 rangelength:[5,10] 输入长度必须介于 5 和 10 之间的字符串(汉字算一个字符)。 15 range:[5,10] 输入值必须介于 5 和 10 之间。 16 max:5 输入值不能大于 5。 17 min:10 输入值不能小于 10

    jquery.validate 版本大全

    jquery.validate.1.9.0.min.js jquery.validate.1.12.0.min.js jquery.validate.1.13.1.min.js jquery.validate.1.16.0.min.js jquery.validate.1.14.0.min.js jquery.validate.1.15.1.min.js jquery.validate....

    JQueryValidate验证说明

    `jQuery Validate`是一个基于JavaScript库`jQuery`的验证插件,用于高效地验证用户在表单中输入的数据。它提供了一系列预定义的验证规则,同时允许开发者自定义验证方法以满足特定需求。该框架对于创建具有国际化...

    jquery validate 验证手册

    《jQuery Validate验证手册》是针对JavaScript库jQuery的一个插件,主要功能是提供强大的表单验证功能,帮助开发者创建用户友好的、功能丰富的交互式表单。这个插件基于jQuery库,利用JavaScript的强大功能,简化了...

    jquery-validate验证框架使用详解

    3. **验证规则**:jQuery Validate提供了多种内置验证规则,如`required`(必填),`email`(邮箱格式),`url`(URL格式)等。你可以通过在表单元素的`data-*`属性或JavaScript对象中定义规则,如: ```html ``...

    jquery validate 验证自定义样式

    4. **自定义错误元素样式**:jQuery Validate会自动为错误的输入元素添加一个`error`类。你可以通过CSS来定义这个类的样式,以改变错误状态下的元素外观。 5. **自定义错误标签**:默认情况下,错误消息会在输入...

    jQuery.validate 用法

    引入jQuery和jQuery.validate库后,我们可以通过调用`$("#formID").validate()`来初始化验证。例如: ```html &lt;script src="jquery.js"&gt; &lt;script src="jquery.validate.min.js"&gt; &lt;button type="submit"&gt;...

    jquery-validate 验证插件

    1. **验证规则(Rules)**:`jQuery Validate`通过设置验证规则来指定输入字段必须满足的条件,如非空、长度限制、邮箱格式等。 2. **错误消息(Messages)**:当验证失败时,插件会显示错误消息,开发者可以自定义...

    jquery-validate

    1. **jQuery库**:jQuery是一个轻量级的JavaScript库,它简化了HTML文档遍历、事件处理、动画制作和Ajax交互。`jQuery Validate`依赖于jQuery,因此在使用之前必须先引入jQuery库。 2. **表单验证**:`jQuery ...

    jquery.validate1.7验证插件最新版

    1. **易于使用**:jQuery Validate 插件通过简单的链式调用,即可实现各种验证规则的设置。 2. **内置验证规则**:包括必填项(required)、电子邮件(email)、数字(number)、URL等,满足大多数基本需求。 3. **...

    jquery.validate.js jquery表单验证

    1. **jQuery 库**:jQuery 是一个广泛使用的 JavaScript 库,它简化了 DOM 操作、事件处理、动画效果和 Ajax 交互。在 `jquery.validate.js` 中,jQuery 被用作基础框架,提供了一套简化的 API 来处理表单验证。 2....

    JQuery的validate验证框架.rar

    总之,jQuery的validate验证框架为开发人员提供了一套强大且灵活的前端验证解决方案,通过它,我们可以轻松地控制表单输入,确保用户数据的准确性和一致性,同时保持良好的用户体验。结合服务器端的验证,可以构建出...

    Jquery validate和form插件

    `jQuery validate` 和 `jQuery form` 插件是 jQuery 生态系统中的两个重要工具,它们分别用于增强表单验证和实现 AJAX 无刷新提交,从而提供更流畅的用户体验。 **jQuery validate 插件** `jQuery validate` 是一...

    jquery.validate.min.js

    jquery.validate.min.js jquery jquery验证插件 validate

Global site tag (gtag.js) - Google Analytics