How Ajax () methods relate to background interaction _ajax

Ajax is all called "Asynchronous JavaScript and XML" (Asynchronous JavaScript and XML), a Web development technology that creates interactive Web applications. Ajax technology is a collection of all the techniques currently available in the browser through JavaScript scripts. Ajax in a new way to use all of these technologies, so that the ancient B/S mode of web development has been revitalized.

The Ajax () method is a jquery-bottom AJAX implementation that loads remote data via HTTP requests.

$.ajax ({
type: "Get",
URL: "Handleajaxrequest.action",
data: {paramkey:paramvalue},
async:true,
dataType: "JSON",
success:function (returneddata) {
alert (returneddata);
After a successful request, the callback function is
returned by the server, and the data is processed according to the DataType parameter,
////////////////////////////returneddata--
Function (e) {
alert (e);
Call this function}} if the request fails
;
}

Parameter description:

Type: Request method, "POST" or "get", default to "get".

URL: The address where the request is sent.

Data: Information to be passed to the server, written in key:value form (id:1). The GET request is appended to the URL.

Async: Default True, for asynchronous requests, set to false for synchronous requests.

DataType: The data type that the server is expected to return may not be specified. There are XML, HTML, text, and so on.

In development, the above parameters are used to meet basic requirements.

If you need to pass the Chinese parameter to the server, you can write the parameters behind the URL and use encodeURI encoding.

var Chinese = "Chinese";
var urltemp = "handleajaxrequest.action?chinese=" +chinese;
var url = encodeURI (urltemp);//Encode
$.ajax ({
type: "Get",
url:url,//directly write-encoded URL
success:function ( Returneddata) {
alert (returneddata);
After a successful request, the callback function is
returned by the server, and the data is processed according to the DataType parameter,
////////////////////////////returneddata--
Function (e) {
alert (e);
Call this function}} if the request fails
;

The Struts2 action handles the request:

public void Handleajaxrequest () {
HttpServletRequest request = Servletactioncontext.getrequest ();
HttpServletResponse response = Servletactioncontext.getresponse ();
Sets the return data to HTML text format
response.setcontenttype ("text/html;charset=utf-");
Response.setheader ("Pragma", "no-cache");
Response.setheader ("Cache-control", "No-cache");
PrintWriter out =null;
try {
String Chinese = request.getparameter ("Chinese");
Parameter values are in Chinese and need to be converted
Chinese = new String (chinese.getbytes ("iso--"), "utf-");
System.out.println ("Chinese is:" +chinese);
Business process
String resultdata = "Hello World";
out = Response.getwriter ();
Out.write (resultdata);
If JSON data is returned, Response.setcontenttype ("application/json;charset=utf-");
Gson Gson = new Gson ();
String result = Gson.tojson (resultdata);///Convert data to JSON format
//out.write (Result)
with Gson; Out.flush ();
} catch (Exception e) {
e.printstacktrace ();
} Finally {
if (out!= null) {
out.close ();
}
}
}

Struts.xml configuration file: No write return type required

<action name= "Handleajaxrequest" class= "com.test.TestAction" method= "Handleajaxrequest"
>
</ Action>

Sharing ajax front and rear interaction methods

Note: Ajax determines whether the async parameter is asynchronous or synchronous, false synchronous, true asynchronous;

The asynchronous execution sequence is to execute the following action first, then execute the success code;

Synchronization is the execution of success code, followed by subsequent code execution;

Verify: Is the data volume large when synchronizing? For example, when searching for large amounts of data from the background, does the page die?

1, (asynchronous) method call, the subsequent code does not need to wait for its execution results

Background <c#>:

Using System.Web.Script.Services; 
public static string Getstr (String str1, String str2) 
{return 
str1 + str2; 
}

Front desk <jquery>:

function Test (STRMSG1,STRMSG2) 
{
$.ajax ({
type: Post),
URL: "Demo.aspx/getstr",
async:true,
//method The writing of the parameters must be right, consistent with the background, case-sensitive, can not be an array, str1 as the name of the formal parameter, str2 for the second formal parameter of the name 
data: "{' str1 ': ' +strmsg1+ ', ' str2 ': '" + strmsg2+ "'}",
contentType: "Application/json; Charset=utf-8 ",
dataType:" JSON ",
success:function (data) {
///returned to get Content 
alert (DATA.D) with DATA.D;
}　　,
error:function (err) {
alert (err);
}
});
Hide Load Animation
$ ("#pageloading"). Hide ();

2, (synchronous) method call, can be used to need to get the return value is to execute subsequent code premise

Background <c#>:

Using System.Web.Script.Services; 
public static string Getstr (String str1, String str2) 
{return 
str1 + str2; 
}

Front desk <jquery>:

 function Test (STRMSG1,STRMSG2) {var str = ""; $.ajax ({type: "Post", url: "Demo.aspx/getstr", Async:false,//method The writing of parameters must be right, consistent with the background, case-sensitive, not an array, etc., str1 as the name of the formal parameter, STR2 is the name of the second formal parameter data: "{' str1 ': '" +strmsg1+ "', ' str2 ': '" +strmsg2+ "'}", ContentType: "Application/json; Charset=utf-8 ", DataType:" JSON ", success:function (data) {////returned by DATA.D get content with str = DATA.D;}, Error:function (err) {AL
ERT (ERR);
　}
}); 
return str;