您好,欢迎访问一九零五行业门户网

实例详解jQuery Validator验证Ajax提交表单的方法和Ajax传参的方法

本文主要介绍了jquery validator验证ajax提交表单的方法和ajax传参的方法,在文中还给大家提到了jquery .ajax提交表单的写法,具体实例代码大家参考下本文,希望能帮助到大家。
serialize() 方法通过序列化表单值,创建 url 编码文本字符串。代替了一个一个传参的方式。
以往写的ajax传参方式
$.ajax({          url : ${ctx}/sjstandarddampartition/insertorupdatedampartition,          type : post,          datatype : json,          data: {beginsectionid:function(){               return $('#number option:selected').val();             },             beginelevation:function(){               return $('#onset').val();             },             endelevation:function(){               return $('#end').val();             }         },          success : function(result) {          }        });
用serialize()的传参方式       
 var param = $(#standform).serialize();         $.ajax({          url : ${ctx}/sjstandardstandardinfo/insertorupdatestandardinfo,          type : post,          datatype : json,          data: param,          success : function(result) {          }        });
当我们在一些稍微复杂的业务时,可能会遇到需要多个表单form在同一个页面的情况,但是提交一个表单以后不想页面刷新或者跳转,那么我们考虑到的就是ajax提交表单,那么如何让jquery的validator插件也可以对异步提交的表单进行验证呢?我们继续往下看。
在这里,我就用网络上的一个例子来说明好了。
下面是一个比较常见的jquery .ajax提交表单的写法
$(#submitbutton).click(function(){  //序列化表单    var param = $(#leavesave).serialize();    $.ajax({     url : leavesave.action,     type : post,     datatype : json,     data: param,     success : function(result) {  if(result=='success') {  location.href='allrequisitionlist.action';  } else if(result.startwith(error_)){  $(#errormessage).html(result.substring(6));  } else {  //返回的结果转换成json数据  var jsonobj = eval('('+result+')');  starttime = $(#startdate).val();  endtime = $(#enddate).val();  hour = jsonobj.hour;  reason = jsonobj.reason;    replacedom(starttime,endtime,hour,reason);  }  }  });  });
如果想用ajax提交表单,还想用jquery的validate进行验证,那么可以这样解决:表单还是正常编写的表单内容,type还是submit类型,只不过在validate验证通过后的方法中使用ajax提交表单
$(#saveworkextra).validate({  onsubmit:true,// 是否在提交是验证  onfocusout:false,// 是否在获取焦点时验证  onkeyup :false,// 是否在敲击键盘时验证  rules: {  ....  },  messages:{  ....  },  submithandler: function(form) { //通过之后回调     var param = $(#savetoworkextra).serialize();     $.ajax({  url : workextrachange.action,  type : post,  datatype : json,  data: param,  success : function(result) {  if(result=='success') {       location.href='allrequisitionlist.action';  } else {       var jsonobj = eval('('+result+')');  }  }     });       },       invalidhandler: function(form, validator) { //不通过回调      return false;       }  });
相关推荐:
bootstrapvalidator校验方式
bootstrap validator使用注意事项(必看篇)
解析javascript的动态传参及动态属性。
以上就是实例详解jquery validator验证ajax提交表单的方法和ajax传参的方法的详细内容。
其它类似信息

推荐信息