jquery validate 插件使用小结
2013-09-02 11:22
501 查看
项目中整合了jquery validate插件,仿照别人的使用写了我的表单验证,结果不起作用。然后就各种找原因。
在网上下了jquery validate插件的完整包,看了看里边的例子,跟我的使用貌似没什么差别。
后来才想起来,以前在这个项目某个功能中使用validate插件的时候,貌似有过类似的问题,一时又想不起来问题出在哪。然后就回去找原来的代码看。
恍然大悟,例子中的表单验证是普通的表单提交,而我的表单提交是jquery ajax提交。想起来validate默认的验证触发事件是表单的submit事件。那么这应该是问题所在。
然后按照ajax提交调用validate验证的方式修改了我的表单验证。表单的验证代码如下(ajax方式提交表单)
$("#sendForm").validate({
submitHandler : function(form) {
$(form).find(':submit').attr('disabled', true);
preSubmit();
$.ajax({
url : "file_send_submit.jspx",
type : "post",
dataType : "json",
data : $("#sendForm").serialize(),
success : function(msg) {
if(msg.success=='true') {
alert("提交成功!");
afterSubmit(true);
} else {
alert("提交失败!");
afterSubmit(false);
}
},
error : function() {
alert("提交出错!");
afterSubmit(false);
}
});
}
});
这段验证代码是按照之前的成功例子修改的。但是表单依然不验证。
不解。
折腾了老半天,问题总算找到了,<input class="edit_input w_332" maxlength="100" type="text" name="sendName" id="sendName" class="required“/>,这是我原来的输入框写法,然后改成了<input class="edit_input w_332 required" maxlength="100" type="text" name="sendName" id="sendName"/>,输入框变成了必须输入,验证生效。这算是一个不规范的写法引起的吧,泪奔啊,让我闹心了那么久。
在网上下了jquery validate插件的完整包,看了看里边的例子,跟我的使用貌似没什么差别。
后来才想起来,以前在这个项目某个功能中使用validate插件的时候,貌似有过类似的问题,一时又想不起来问题出在哪。然后就回去找原来的代码看。
恍然大悟,例子中的表单验证是普通的表单提交,而我的表单提交是jquery ajax提交。想起来validate默认的验证触发事件是表单的submit事件。那么这应该是问题所在。
然后按照ajax提交调用validate验证的方式修改了我的表单验证。表单的验证代码如下(ajax方式提交表单)
$("#sendForm").validate({
submitHandler : function(form) {
$(form).find(':submit').attr('disabled', true);
preSubmit();
$.ajax({
url : "file_send_submit.jspx",
type : "post",
dataType : "json",
data : $("#sendForm").serialize(),
success : function(msg) {
if(msg.success=='true') {
alert("提交成功!");
afterSubmit(true);
} else {
alert("提交失败!");
afterSubmit(false);
}
},
error : function() {
alert("提交出错!");
afterSubmit(false);
}
});
}
});
这段验证代码是按照之前的成功例子修改的。但是表单依然不验证。
不解。
折腾了老半天,问题总算找到了,<input class="edit_input w_332" maxlength="100" type="text" name="sendName" id="sendName" class="required“/>,这是我原来的输入框写法,然后改成了<input class="edit_input w_332 required" maxlength="100" type="text" name="sendName" id="sendName"/>,输入框变成了必须输入,验证生效。这算是一个不规范的写法引起的吧,泪奔啊,让我闹心了那么久。
相关文章推荐
- jquery validate 插件使用小结
- jQuery Validate 表单验证插件使用方法
- jQuery Validate插件的使用
- 使用jQuery_validate插件时遇到的问题(一)
- jquery中validate与form插件提交的方式小结
- jQuery.validate.js插件使用(struts2的整合)
- 使用jQuery validate插件验证表单
- jquery.validate.js插件使用经验记录
- 快速学习jQuery插件 jquery.validate.js表单验证插件使用方法
- 使用Jquery的validate插件的问题
- jquery表单验证插件(jquery.validate.js)的3种使用方式
- jquery.validate.js插件的remote用法以及使用注意事项
- jquery validate插件使用
- 兼容IE8以下浏览器input表单属性placeholder不能智能提示功能,以及使用jquery.validate.js表单验证插件的问题处理
- JQuery插件使用小结
- 前端小结2--jQuery分页插件JPaginate的详细使用
- jQuery-Validate验证插件的使用步骤详解
- JQuery 验证插件validate的showErrors参数的使用
- JQuery插件使用小结
- jQuery-Validate验证插件的使用步骤详解