A Simple Method for Ajax asynchronous form data submission

Scenario Description:

There is a logon form on a logon page, but the login verification logic is complicated. We hope that the current page will not be refreshed after clicking logon, after the logon result is displayed, select whether to jump to the new page or prompt that the user name and password are incorrect. There are many problems like this. Asynchronous Data Acquisition greatly enhances user experience.

Background:

Ajax refers to Asynchronous JavaScript and XML (Asynchronous JavaScript and XML ).
Ajax is not a new programming language, but a method for creating better, faster, and more interactive
Web application technology. Through Ajax, your javascript can use the XMLHTTPRequest object of JavaScript to directly communicate with the server. With this object, your javascript can exchange data with the Web server without reloading the page. Ajax
Use asynchronous data transmission (HTTP request) between the browser and the Web server so that the webpage can request a small amount of information from the server, rather than the whole page. AJAX can make Internet applications smaller, faster, and more friendly. Ajax
It is a browser technology independent of web server software. Ajax is based on the following web standards: the Web standards used by JavaScript xml html css in Ajax have been well defined and supported by all mainstream browsers. Ajax applications are independent of browsers and platforms. Web
Applications have many advantages over desktop applications. They can involve a wide range of users, which are easier to install, maintain, and develop. However, Internet applications are not as comprehensive and user-friendly as traditional desktop applications.
Through Ajax, Internet applications can be improved and more friendly.

Usage:

<SCRIPT type = "text/JavaScript"> (function () {jquery ('# loginform '). click (function () using jquery('{tips'}.html ("logging on ..... "); jquery. post ('login. action ', {"username": jquery (' # username '). val (), "password": jquery ('# password '). val ()}, function (result) implements jquery('{tips'}.html (result) ;}, "JSON") ;}) ;}(); </SCRIPT>

The post method has four parameters.

The first is the URL address. In struts2, we only need to submit it to the corresponding action or specify a method. For webx, do you want to write urladdress login.htm like this? Action = user_login & event_submit_do_user_login = any

The second is the parameter list. The data you want to submit is submitted in the form of key-value pairs.

The third parameter is the result processing function, and the result is retrieved from the result.

The fourth parameter is the data return format.

In this case, actions or screen must be processed as follows:

HttpServletResponse response = rundata.getResponse();response.setContentType("application/json");PrintWriter out;try {out = response.getWriter();String result = (String) context.get("result");JSONObject json = new JSONObject();json.put("result", result);out.print(json);out.flush();} catch (IOException e) {e.printStackTrace();}

Enter the processing result.

Contenttype has many formats, refer to http://sin90lzc.iteye.com/blog/892162