Ajax submission form

Ajax forms are often used in projects. Ajax is used in front-end, whether for simple HTML, JSP, or easyui frameworks, the extjs framework actually uses Ajax but encapsulates it, which is more fixed when we use it.

In general, there are two types of Ajax submission forms. One is that no result is returned, that is, the form data is submitted to the background, and the background processing is complete; the other method is to return the result. The information about successful or failed execution in the background must be returned to the foreground.

1. No returned results

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

2. Items with returned results

This method is the most widely used one, because the execution of the program is successful or not, you need to prompt the user, the program is generally completed in multiple steps, after the completion of the insert operation, you need to initiate a process, in this case, you need to determine the success or failure on the interface.

Ajax itself is a class with returned results. The success method is used to process the returned results in the background.

There are two methods to return results when submitting Ajax forms:

1) serialize form data

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

Note that the items in the form must have the name attribute. The key-value pairs obtained in the background are key = Name and value = values, note that no matter whether it is an input tag, span tag, or other tag, the name attribute must be available, and the item cannot be obtained in the background without the name attribute.

2) Search for form submission in the window

  // 提交表单  var obj = document.getElementById("xx_iframe").contentWindow;  obj.$("#yourform").form("submit",{success :function(data){//对结果处理}  });

This submission method is used when I use the easyui dialog box to insert information, because a dialog box is displayed on the current interface, and a form is submitted in the button trigger dialog box on the dialog box, the dialog box is another HTML page linked to, so $ ("# formid") cannot find the form in the dialog box. Therefore, you can only submit the form in this way.

In addition, get and post requests encapsulated in Ajax also belong to the class with returned results.

These are the examples we have encountered, and we will try to add new forms later ..

Ajax submission form