jquery Ajax Chinese garbled solution

$.ajax ({
DataType: ' JSON ', type: ' POST ', url: ' http://localhost/test/test.do ', data: {id:1, type: ' Product '},success:function (data) { } } );
Problem:
When the back-end action program is submitted, the type being fetched is garbled
Workaround:
Method One: Use encodeURI two times before submitting the code, remember must be two times
1. Modify the following code

Data:{id:1, Type:encodeuri (encodeURI (' Commodities '))}

2. In the background action to decode the obtained string
1, String type = Request.getparameter ("type");
2, type = Urldecoder.decode (type, "Utf-8″");
Method Two: Ajax configuration contenttype properties, plus Charset=utf-8
Add the following parameters to the Ajax method
ContentType: "application/x-www-form-urlencoded; Charset=utf-8″ use other JS frame or XHR is similar, set header in ContentType can,
The key here is charset=utf-8, if not this, is not possible, the default jquery in the ContentType is not

First, test environment
jquery:1.3.2
tomcat:5.5.17
Second, test methods
1. Using Get method
Server-side Java code:

String name = new String (request.getparameter ("name"). GetBytes ("Iso8859-1"), "Utf-8");

Client JS Code:

$.ajax {url: ' 2.jsp ', type: ' Get ', data: {name: ' Chinese '},success:function (response) {
alert (response);
}});

Results: Correct display

$.ajax ({url: "2.jsp", type: "Get", Data: "Name= Chinese", success:function (response) {
alert (response);
}});

Result: garbled

$.get ("2.jsp", {name: "Chinese"},function (response) {
alert (response);
});

Results: Correct display
Copy code code as follows:
$.get ("2.jsp", "name= Chinese", function (response) {
alert (response);
});

Result: garbled

2.post mode
Server-side Java code:

Request.setcharacterencoding ("UTF-8");
String name = Request.getparameter ("name");

Client JS Code:

$.ajax ({url: "3.jsp", type: "POST", Data: "Method=testajaxpost&name= Chinese", success:function (response) {
alert (response);
}});

Results: Correct display
$.ajax ({url: "3.jsp", type: "POST", data: {name: "Chinese"},success:function (response) {
alert (response);
}});

Results: Correct display

$.post ("3.jsp", {name: "Chinese"},function (response) {
alert (response);
});

Results: Correct display

$.post ("3.jsp", "name= Chinese", function (response) {
alert (response);
});

Results: Correct display
Third, the use of filter

public void Dofilter (ServletRequest request, servletresponse response,
Filterchain chain) throws IOException, Servletexception {
HttpServletRequest req = (httpservletrequest) request;
if (Req.getheader ("X-requested-with")!= null && req.getheader ("X-requested-with"). Equalsignorecase (" XMLHttpRequest ")) {
Request.setcharacterencoding ("Utf-8");
} else {
Request.setcharacterencoding ("GBK");
}
Chain.dofilter (request, response);
}

jquery adds x-requested-with to the header when using AJAX, with the value: Xmlhttprequest,filter the character encoding to UTF8 when the AJAX request in jquery is judged to be This solves the Chinese garbled problem in post submission, and does not need to set request.setcharacterencoding ("UTF-8") in the Code;
For the Chinese garbled problem of get way, we suggest not to use get method to submit Chinese, all change to post ^-^

To be consistent with the way Prototype.js handles Chinese, you can customize the properties in the header by using the following methods RequestType

$.ajax ({
URL: "3.jsp",
Type: "Post",
Data: {name: "Chinese"},
Beforesend:function (XMLHttpRequest) {
Xmlhttprequest.setrequestheader ("RequestType", "Ajax");
Alert ("Start");
},
Success:function (data, textstatus) {
alert (data);
},
Error:function (XMLHttpRequest, Textstatus, Errorthrown) {
Alert ("Error:" + textstatus);
},
Complete:function (XMLHttpRequest, Textstatus) {
Alert ("Finished:" + textstatus);
}
});

The filter code is as follows:

public void Dofilter (ServletRequest request, servletresponse response,
Filterchain chain) throws IOException, Servletexception {
HttpServletRequest req = (httpservletrequest) request;
if (Req.getheader ("RequestType")!= null && req.getheader ("RequestType"). Equalsignorecase ("Ajax")) {
Request.setcharacterencoding ("Utf-8");
} else {
Request.setcharacterencoding ("GBK");
}
Chain.dofilter (request, response);
}