jQuery Validator verifies Ajax form submission method and Ajax parameter passing method (picture and text tutorial)-JS Tutorial-php.cn

jQuery Validator verifies Ajax form submission method and Ajax parameter passing method (picture and text tutorial)

亚连

Release： 2018-05-22 10:18:48

Original

1766 people have browsed it

This article mainly introduces the method of jQuery Validator to verify the Ajax submission form and the method of Ajax passing parameters. The article also mentions how to write the jquery .ajax submission form. For specific example codes, please refer to this article

# The ##serialize() method creates a URL-encoded text string by serializing form values. Instead of passing parameters one by one

The ajax parameter passing method written in the past

$.ajax({ 
        url : "${ctx}/SJStandardDamPartition/insertOrUpdateDamPartition", 
        type : "post", 
        dataType : "json", 
        data: {beginsectionid:function(){
              return $(&#39;#number option:selected&#39;).val();
            },
            beginelevation:function(){
              return $(&#39;#onset&#39;).val();
            },
            endelevation:function(){
              return $(&#39;#end&#39;).val();
            }
        }, 
        success : function(result) { 
        } 
      });

Copy after login

uses the parameter passing method of serialize() In business, you may encounter situations where you need multiple forms on the same page, but you don’t want the page to refresh or jump after submitting a form. Then what we consider is Ajax submission of the form, so how can the jQuery validator plug-in also work? What about validating asynchronously submitted forms? Let's continue reading.

Here, I will use an example from the Internet to illustrate.

The following is a relatively common way to write jquery .ajax submission form

 var param = $("#standForm").serialize(); 
       $.ajax({ 
        url : "${ctx}/SJStandardStandardInfo/insertOrUpdateStandardInfo", 
        type : "post", 
        dataType : "json", 
        data: param, 
        success : function(result) { 
        } 
      });

Copy after login

If you want to use ajax to submit the form, you also want to use jquery Validate is used for verification, so it can be solved like this: the form is still the normally written form content, and the type is still the submit type, but in the validate method after passing the verification, ajax is used to submit the form

$("#submitButton").click(function(){ 
//序列化表单 
  var param = $("#leaveSave").serialize(); 
  $.ajax({ 
   url : "leaveSave.action", 
   type : "post", 
   dataType : "json", 
   data: param, 
   success : function(result) { 
if(result==&#39;success&#39;) { 
location.href=&#39;allRequisitionList.action&#39;; 
} else if(result.startWith("error_")){ 
$("#errorMessage").html(result.substring(6)); 
} else { 
//返回的结果转换成JSON数据 
var jsonObj = eval(&#39;(&#39;+result+&#39;)&#39;); 
startTime = $("#startdate").val(); 
endTime = $("#enddate").val(); 
hour = jsonObj.hour; 
reason = jsonObj.reason; 
 
replaceDom(startTime,endTime,hour,reason); 
} 
} 
}); 
});

Copy after login

The above is what I compiled for everyone , I hope it will be helpful to everyone in the future.

Principles of Ajax cross-domain requests (graphic tutorial)

dwz How to remove ajaxloading (graphic tutorial)

Ajax cooperates with node js multer to implement file upload function

The above is the detailed content of jQuery Validator verifies Ajax form submission method and Ajax parameter passing method (picture and text tutorial). For more information, please follow other related articles on the PHP Chinese website!