Using jquery + ajax in jsp to transmit json format parameters between the front and back ends

After a period of experiment, we finally completed the parameter transfer between the front and back. The experiment uses the tool myeclipse + structs1.2.

Summary: error-prone areas: 1. in ajax, the data format must be correct. Here we use two forms: data: {parameter: ""} and data: "parameter =" + variable.

2. The data transferred from the background to the foreground is converted to the json format.

3. jquery must be referenced in js. Otherwise, the jquery statement will not be executed. This problem has plagued me for a long time, And cainiao is sad. Jquery reference process is as follows: Download jQuery. js online, jquery-1.4.2.min.js two js files, put under the webroot folder js, reference code is as follows:

<Script src = "<% = path %>/js/jQuery. js" language = "javascript" type = "text/javascript"> </script>

<Script src = "<% = path %>/js/jquery-1.4.2.min.js" language = "javascript" type = "text/javascript"> </script>

<% = Path %> indicates the wenroot directory.

4. the url path of ajax must be correct.

5. data does not need to be written or replaced by data :{} when no parameters are transmitted to the backend.

The front-end code is as follows:
Copy codeThe Code is as follows:
<Span style = "white-space: pre"> </span> var checkValue = $ ("# s1"). val ();

Copy codeThe Code is as follows:
<Span style = "white-space: pre"> </span> // This var is the opention value selected by the select statement of the obtained id s1.
$
. Ajax ({
Type: "post ",
Url: "getShowDataList. do ",
Async: true,
// Data: {data: ""}.
Data:
"Filepath =" + checkValue

Copy codeThe Code is as follows:
<Span style = "white-space: pre"> </span> // data: the data transmitted to the background. The data format here is json.
,
DataType: "json ",
Error: function (){
// Alert (checkValue );
Alert ('loading failed! ');
},
Success: function (json ){

Copy codeThe Code is as follows:
<Span style = "white-space: pre"> </span> // here, json is the data transmitted in the background. Here, the data format is also json.

The front-end obtains the list dataset in json format in the background, which is written in the function.
Copy codeThe Code is as follows:
Var points = []; // create an array
For (var I = 0; I <json. length; I ++ ){

Var str = new OpenLayers. LonLat (json [I]. lon,
Json [I]. lat );
Points. push (str );

}

Background code:
Copy codeThe Code is as follows:
Public ActionForward execute (ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response ){

String filepath = request. getParameter ("filepath ");

Copy codeThe Code is as follows:
<Span style = "white-space: pre"> </span> // obtain the filepath passed by the foreground.
System. out. println (filepath );

List <Show> datalist = getShowData (filepath );

Response. setContentType ("appliction/json; charset = UTF-8 ");
JSONArray jsonArray = JSONArray. fromObject (datalist );

Copy codeThe Code is as follows:
Try {

PrintWriter out = response. getWriter ();
Out. print (jsonArray );
For (int I = 0; I <jsonArray. size (); I ++ ){
System. out. println (jsonArray. get (I ));
}
Out. flush ();
} Catch (Exception e ){
E. printStackTrace ();
}
Return null;
}