Coding With Fun
Home Docker Django Node.js Articles Python pip guide FAQ Policy

Ajax submits the form method


May 08, 2021 AJAX


Table of contents


AJAX submits a form method


AJAX submitsform forms, which are often used in everyday projects. Whether the fore desk is simple html, jsp, or using the easyui framework, AJAX is generally used whenever a form is submitted.

There are two types of AJAX submission forms

1, no return results, is to submit the form data directly to the background, let the background directly processing;

The simplest is $("#formid"). submit (); Submit theform form directly to the background.

2, return the result, in this case, whether the background execution success or failure, the final information needs to be returned to the fore desk.

The second is the most used one, because the success of the program needs to give the user tips, the program is generally multi-step completion, after the insertion operation, need to initiate the process, which needs to be judged on the interface success or failure. ajax itself falls into the category of return results, where the success method handles background return results.

The AJAX submission form has two implementations that return results

1, the form form data serialization

<span style="font-size:18px;">  $.ajax({  
    type: "POST",  
    url:your-url,  
    data:$('#yourformid').serialize(),  
    async: false,  
    error: function(request) {  
        alert("Connection error");  
    },  
    success: function(data) {  
        //接收后台返回的结果  
    }  
  });</span>  

It is important to note that the premise of using this method is that the items in the form must have name properties, and the key value pairs obtained in the background are key-name values and value-values.

Note: Whether input span label or something else, be sure to have a name property that is not available in the background without the name property.

2, through the window to find the form submission

<span style="font-size:18px;">  // 提交表单  
  var obj = document.getElementById("xx_iframe").contentWindow;  
  obj.$("#yourform").form("submit",{  
    success :function(data){  
        //对结果处理  
    }    
  });</span>

Because the dialog box pops up on the current interface, and then the button on the dialog box triggers the form submission in the dialog box, the dialog box is another html page linked, so that the form in the dialog box cannot be found by $("#formid"), so in this case the form can only be submitted in this way.

In addition to the get encapsulated in post requests also fall into the category with returned results. get

In general, form forms must have name property for between between available and resultless (serializing the form form data plus implementingform submission through a window).