`

jquery validate验证插件,在ajax提交方式下的验证

阅读更多

正常的表单都是使用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;//阻止表单提交
   }
});

 

分享到:
评论

相关推荐

    jquery validate表单验证插件制作注册表单提交验证

    在本文中,我们将深入探讨如何使用jQuery Validate插件来创建一个功能完备的注册表单,进行数据提交前的验证。jQuery Validate是一个强大的JavaScript库,它为HTML表单提供了灵活且易于使用的验证规则,确保用户输入...

    Jquery validate和form插件

    `jQuery validate` 是一个强大的验证插件,由 jQuery 团队维护,它允许开发者轻松地为 HTML 表单添加验证规则。该插件的核心特性包括: 1. **易于使用**:通过简单的配置选项,可以快速定义验证规则,如必填项、...

    JQuery Validate插件的验证规则和例子,合成AJAX

    jQuery Validate插件是用于在客户端进行表单验证的强大工具,它提供了丰富的验证规则和自定义方法,使得用户在提交表单前可以即时检测输入数据的有效性,大大提升了用户体验。该插件是jQuery库的一个扩展,通过简单...

    jquery validate 验证自定义样式

    在Web开发中,jQuery Validate是一个非常流行的验证插件,它为HTML表单提供了强大的验证功能。这个插件允许开发者自定义验证规则和错误提示样式,从而实现用户友好的交互体验。在本文中,我们将深入探讨如何利用...

    jquery validate 验证手册

    在《jQuery Validate验证手册》中,你会找到详细的使用指南,包括如何初始化验证、如何定义验证规则、如何处理错误消息、如何与其他jQuery插件集成等内容。此外,手册还会介绍如何自定义验证插件,以适应不同项目的...

    jQuery Validate插件验证表单小练

    在这个“jQuery Validate插件验证表单小练”中,我们将深入探讨该插件的基本用法、核心功能以及如何在实际项目中应用。 首先,jQuery Validate 插件的核心在于它的验证规则。这些规则可以设置为必填(required)、...

    jquery validate验证示例

    在这个“jquery validate验证示例”压缩包中,很可能包含了 `jQuery Validate` 插件的核心文件以及一些示例代码,帮助开发者快速理解和使用这个插件。 首先,`jQuery Validate` 的核心功能包括: 1. **基本验证**...

    jQuery validate框架的个性化验证

    jQuery Validate 是一个强大的客户端验证插件,用于在用户提交表单前进行实时验证。这个框架大大简化了HTML表单的验证过程,提供了丰富的内置验证规则和可扩展的自定义验证功能,使得表单验证更加人性化和高效。 1....

    jQuery Validate插件实现表单验证

    jQuery Validate插件是一个非常流行的JavaScript库,它在客户端实现表单验证方面提供了广泛的功能。通过利用这个插件,开发者可以轻松地在用户的浏览器端对表单数据进行检查,以确保输入的数据符合特定的格式和规则...

    jQuery.validate验证

    jQuery.validate还支持许多插件,如additional-methods.js,它包含了更多验证方法,如`alpha`, `alnum`, `lettersonly`等。 7. **异步验证**: `remote`规则可以用来进行服务器端验证,通过AJAX请求向服务器发送...

    Jquery validate表单验证Demo下载

    在本文中,我们将深入探讨jQuery Validate插件,这是一种强大的JavaScript工具,用于实现高效且易于定制的表单验证。...通过下载提供的"jquery validate表单验证插件",您可以开始实践并体验其强大功能。

    jquery表单验证插件

    而"jquery表单验证插件"则是基于jQuery构建的一种工具,用于增强表单数据输入的验证功能,确保用户提交的数据符合预设的规则。这款插件极大地提高了用户体验,因为它可以在用户输入时即时反馈错误,而无需等待表单...

    jquery validate和jquery form 插件组合实现验证表单后AJAX提交

    **jQuery validate.js** 是一个强大的表单验证插件,它允许开发者预设一系列规则,用于检查表单字段的内容是否符合要求。例如,可以设置必填项、电子邮件格式、数字范围等验证规则。这样,用户在填写表单时,如果...

    Jquery插件,JqueryUI,JqueryForm,JqueryValidate,Jqueryvsdoc

    这个插件支持多种提交方式,如文件上传,同时提供了丰富的回调函数和选项,以控制提交过程的每个阶段,如开始、成功和错误状态。 3. **jQuery Validate** jQuery Validate 是一个用于表单验证的插件,它为开发者...

    jquery validate和validform验证插件的对比.pdf

    《jQuery Validate与Validform验证插件的对比分析》 在前端开发中,表单验证是不可或缺的一环,它能够确保用户输入的数据符合预期格式,从而提高用户体验和数据准确性。jQuery Validate 和 Validform 是两个广泛...

    jquery validate的漂亮css样式验证

    7. **异步验证**:对于需要服务器验证的情况,`jQuery Validate`提供了一个`.ajax()`方法,可以在提交表单前发送请求,根据响应决定是否允许提交。 8. **验证插件的使用**:在实际项目中,你可能需要结合其他插件,...

    自带丰富示例的jQuery验证表单插件

    9. **与其他jQuery插件的兼容性**:由于基于jQuery,这个验证插件能很好地与其它jQuery UI组件或表单增强插件(如Bootstrap Form Validation)协同工作。 在实际应用中,使用jQuery Validate插件通常包括以下步骤:...

    jquery validate例子

    此外,jQuery Validate提供了丰富的事件和方法,如`submitHandler`(表单提交时触发)、`valid`(验证通过时触发)和`invalid`(验证失败时触发),可以帮助开发者在验证过程中进行更精细的控制。 现在,我们来看一...

    最新实用的Validate通用表单验证Jquery插件

    这个插件极大地简化了表单验证的过程,使得用户输入的数据在提交前就能得到有效的检查,从而提高了用户体验和数据准确性。 Validate插件是基于Jquery库构建的,因此,首先需要在项目中引入Jquery。Jquery是一个强大...

    jQuery表单验证插件validate支持拓展.zip

    该压缩包"jQuery表单验证插件validate支持拓展.zip"很可能包含了validate插件的核心文件、扩展文件以及相关的示例或文档,帮助开发者更好地理解和使用这个插件。文件名"132674313582884251"可能是一个时间戳,代表了...

Global site tag (gtag.js) - Google Analytics