正常的表单都是使用submit按钮来提交,jquery  validate插件可以方便的做表单验证。

做一个发送短信的功能,向目标表插入多条记录,界面采用ajax来提交表单,等待效果直接用ext的遮罩了。

但是如何验证却碰到问题。

解决方式很简单,表单跟正常表单一样,validate的submitHandler,invalidHandler这2个方法都需要覆盖,都 return false;这样表单就不会在点击按钮的时候提交了,表单验证跟正常验证起作用。submitHandler在return 之前写上我们的表单处理代码就ok了。

代码如下,可以忽略ext相关代码。

 //表单验证
$("#query").validate({
onkeyup : false,
onclick : false,
onfocusout : false,
rules : {
msg : {
required : true,
maxlength : 10
}
},
messages:{
msg:{
required : '请输入短信内容!',
maxlength : '长度超过10!'
}
},
showErrors : function(errorMap, errorList) {
var msg = "";
$.each(errorList, function(i,v){
msg += (v.message+"\r\n");
});
if(msg!="")
Ext.Msg.alert('表单',msg + fix);
},
invalidHandler : function(){
return false;
},
submitHandler : function(){
//表单的处理
Ext.Msg.confirm("确认", "是否确认发送?" + fix, function(button,text){
if(button == 'yes'){
loadMarsk.show();
$.ajax({
url:'<%=basePath %>promotionAction.do?method=group',
dataType:'json',
type:'post',
data:$('#query').serialize(),
error:function(){
Ext.Msg.alert('错误','请求错误!' + fix);
loadMarsk.hide();
},
success:function(data){
Ext.Msg.alert('成功',data.msg + fix);
loadMarsk.hide();
}
})
}
} ); //confirm
return false;//阻止表单提交
}
});

关键在于:validate的submitHandler,invalidHandler这2个方法都需要覆盖,都 return false;

转自:http://www.cnblogs.com/longterm/archive/2012/05/18/2507594.html

【转载】jquery validate验证插件,在ajax提交方式下的验证的更多相关文章

  1. jQuery通过jquery.form.js插件使用AJAX提交Form表单

    我简单使用了一下,jQuery Form插件有一下优点:  1.支持提交前验证. 2.支持提交后回调. 3.采用AJAX方式,有很好的用户体验 4.提交方式是灵活.只要指定要提交的form ID即可. ...

  2. jquery.validate.js插件的使用方法

    近期做项目.须要用到 jQuery.validate.js插件,于是记录一下工作中的一些经验,以便日后学习. [样例例如以下] 1.前台页面 <form id="form1" ...

  3. jQuery中开发插件的两种方式

    jQuery中开发插件的两种方式(附Demo) 做web开发的基本上都会用到jQuery,jQuery插件开发两种方式:一种是类扩展的方式开发插件,jQuery添加新的全局函数(jQuery的全局函数 ...

  4. 用jQuery Validate+layer插件实现好看的表单提交效果

    作为初学者,以前做表单验证都是自己写的,目的是让自己更好的了解代码,加深自己对javascript的理解,但是其实在很久都知道有一个很好用的表单验证插件:jQuery Validate.js,一直都没 ...

  5. 使用jquery.validate.js插件进行表单里控件的验证

    jsp中具体实现的代码: <%@ page language="java" contentType="text/html; charset=UTF-8" ...

  6. 【转载】[jquery.validate]自定义方法实现"手机号码或者固定电话"的逻辑验证

    最近项目开发中遇到这样的需求“手机号码或者固话至少填写一个”,如下图所示: 项目采用的jquery.validate.js验证组件,目前组件不支持这种“或”逻辑的验证,于是就自己定义一个 jQuery ...

  7. jquery.validate.js插件使用

    jQuery验证控件jquery.validate.js使用说明+中文API 官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-valid ...

  8. jQuery validate在没有校验通过的情况下拒绝提交

    下面通过一个简单的例子说明,这个问题,可能是很多人遇到的,验证不通过的时候,依然提交了表单. HTML <form class="survey" id="surve ...

  9. ajax提交表单无法验证easyui的验证选项(比如required等)

    在实际开发中,遇到ajax方式提交表单没法验证easyui的验证选项,这对实际用户体验造成了很大的困扰.当然,这也是理所当然的事情.   解决办法:使用jquery中ajax的beforeSend事件 ...

随机推荐

  1. UWP滑动后退

    经过近些年智能手机App的不断发展,用户已经不仅仅满足于功能上的需求.UI.设计等非功能点逐渐在App体验中占了大多数的分数.不知从何时起,滑动手势就成为了App的一个标配.他不仅仅是一个功能,更是一 ...

  2. dojo/aspect源码解析

    dojo/aspect模块是dojo框架中对于AOP的实现.关于AOP的详细解释请读者另行查看其它资料,这里简单复习一下AOP中的基本概念: 切面(Aspect):其实就是共有功能的实现.如日志切面. ...

  3. 【原创】GC/垃圾回收简介

    GC简介 1 GC机制 1.1 对象 从计算机的角度,装有数据的内存空间 1.2 作用 将内存垃圾的释放自动化 1.3 本质 将已经引用不到的对象视为死亡,将死亡的对象找出来并且作为垃圾进行回收 2 ...

  4. ComponentOne 2016 年产品规划

    作为老牌的 Visual Studio 控件集,ComponentOne 今后的发展方向是什么?新的一年会在哪些方面有所增强?且听 ComponentOne 全球产品经理的 2016年规划. 2016 ...

  5. mysql C API的使用

    <MySQL++简介>介绍了如何使用C++来访问mysql,本文记录下使用C API访问mysql,mysql++就是对本文介绍的C-API的封装. 常用函数(名字就能告诉我们用法): M ...

  6. 说说设计模式~建造者模式(Builder)

    返回目录 建造者模式是我的"设计模式"里创建型模式里的最后一篇,这种模式在实现中,很多架构都用到了,如MVC,MVP,MVVM,它们都是有建造者模式的精髓的,即,创建与表现分享,我 ...

  7. Js~(function(){})匿名自执行方法的作用

    匿名自执行方法体(function(){})经常用在设计JS插件上面,它定义相关组件的行为,自动初始化相关属性,而且在页面中可以直接执行,你不需要手动执行它,它被自动被执行! 在设计你的匿名自执行方法 ...

  8. SQL中group by的用法

    group by即按照给定字段对结果集进行分组,从字面意义上理解就是根据"by"指定的规则对数据进行分组,所谓的分组就是将一个"数据集"划分成若干个" ...

  9. Chrome清除dns缓存

    Chrome清除dns缓存 为了加快访问速度,Google Chrome浏览器采用了预提DNS记录,在本地建立DNS缓存的方法,加快网站的连接速度.你在谷歌Chrome浏览器的地址栏中输入about: ...

  10. java 中获取2个时间段中所包含的周数(股票的周数->从周六到周五)

    Calendar 类中是以周日为开始的第一天的,所以Calendar.DAY_OF_WEEK为1的时候是周日. 在股票中有日K 周K和月K的数据.  在此之中的周K是指交易日中一周的数据,周六到周五为 ...