Ajax Request Data

The Ajax () method is the underlying AJAX implementation of jquery, which loads remote data through HTTP requests.

?

123456789101112131415161718

$.ajax({type: "GET",url: "handleAjaxRequest.action",data: {paramKey:paramValue},async: true,dataType:"json",success: function(returnedData) {alert(returnedData);//请求成功后的回调函数//returnedData--由服务器返回，并根据 dataType 参数进行处理后的数据；//根据返回的数据进行业务处理},error: function(e) {alert(e);//请求失败时调用此函数}});}

Parameter description:

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

URL: The address where the request was sent.

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

Async: Default True, which is the synchronous request, which is set to false for the asynchronous request.

DataType: Expected data type returned by the server, can not be specified. There are XML, HTML, text, and so on.

In development, the use of the above parameters has been able to meet the basic requirements.

If you need to pass Chinese parameters to the server, you can write the parameters behind the URL and encode them with encodeURI.

?

123456789101112131415161718

var chinese = "中文";var urlTemp = "handleAjaxRequest.action?chinese="+chinese;var url = encodeURI(urlTemp);//进行编码$.ajax({type: "GET",url: url,//直接写编码后的urlsuccess: function(returnedData) {alert(returnedData);//请求成功后的回调函数//returnedData--由服务器返回，并根据 dataType 参数进行处理后的数据；//根据返回的数据进行业务处理},error: function(e) {alert(e);//请求失败时调用此函数}});}

The Struts2 action handles the request:

?

123456789101112131415161718192021222324252627282930

public void handleAjaxRequest() {HttpServletRequest request = ServletActionContext.getRequest();HttpServletResponse response = ServletActionContext.getResponse();//设置返回数据为html文本格式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");//参数值是中文，需要进行转换chinese = new String(chinese.getBytes("ISO--"),"utf-");System.out.println("chinese is : "+chinese);//业务处理String resultData = "hello world";out = response.getWriter();out.write(resultData);//如果返回json数据，response.setContentType("application/json;charset=utf-");//Gson gson = new Gson();//String result = gson.toJson(resultData);//用Gson将数据转换为json格式//out.write(result);out.flush();}catch(Exception e) {e.printStackTrace();}finally {if(out != null) {out.close();}}}

Struts.xml configuration file: No write return type required

?

123	<action name="handleAjaxRequest"class="com.test.TestAction"method="handleAjaxRequest"></action>

Sharing Ajax front and back interaction methods

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

The asynchronous execution order is to perform the following actions before executing the success code;

Synchronization is to execute the success code first, and then execute the subsequent code;

Verify: Is the amount of data in sync too large to be stuck? For example, when searching large amounts of data from the background, does the page get stuck?

1, (asynchronous) method invocation, subsequent code does not need to wait for its execution result

Backstage <c#>:

?

12345

using System.Web.Script.Services; public static string GetStr(string str1, string str2) { returnstr1 + str2; }

Front desk <jquery>:

?

123456789101112131415161718192021

function Test(strMsg1,strMsg2) {$.ajax({type: "Post",url: "Demo.aspx/GetStr",async: true,//方法传参的写法一定要对，与后台一致，区分大小写，不能为数组等，str1为形参的名字,str2为第二个形参的名字 data: "{‘str1‘:‘"+strMsg1+"‘,‘str2‘:‘"+strMsg2+"‘}",contentType: "application/json; charset=utf-8",dataType: "json",success: function(data) {//返回的数据用data.d获取内容 alert(data.d);},error: function(err) {alert(err);}});　　//隐藏加载动画$("#pageloading").hide();}

2, (synchronous) method invocation, can be used to get the return value is to execute the following code premise

Backstage <c#>:

?

12345

using System.Web.Script.Services; public static string GetStr(string str1, string str2) { returnstr1 + str2; }

Front desk <jquery>:

1234567891011121314151617181920

function Test(strMsg1,strMsg2) {　var str = “”;$.ajax({type: "Post",url: "Demo.aspx/GetStr",async: false,//方法传参的写法一定要对，与后台一致，区分大小写，不能为数组等，str1为形参的名字,str2为第二个形参的名字 data: "{‘str1‘:‘"+strMsg1+"‘,‘str2‘:‘"+strMsg2+"‘}",contentType: "application/json; charset=utf-8",dataType: "json",success: function(data) {//返回的数据用data.d获取内容 str = data.d;},error: function(err) {alert(err);}});　return str;

Ajax Request Data