The use of Jquery+ajax in JSP to pass JSON format parameters between front and back platform _jsp programming

Source: Internet
Author: User
Tags json
After a period of experiments to ponder, and finally the parameters between the front and back of the pass is done, the experiment tools myeclipse+structs1.2.

Summary: Error-prone places: The format of data in 1.ajax must be written to the right, there are two forms, one is the data:{parameter: ""} The other is data: "parameter =" + variable.

2. Background transfer to the foreground data into the JSON format, the steps to master.

3. In JS use jquery must be quoted in, otherwise will not execute jquery statement, this problem bothered me for half a day to solve off, rookie of sorrow Ah. The jquery reference process is as follows: Download jquery.js,jquery-1.4.2.min.js two JS files on the Internet, put in the folder JS under Webroot, reference code 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>

Where <%=path%> represents the root directory wenroot file directory.

The URL path for 4.ajax must be written to.

5. The current station does not pass parameters to the background, data can not be written, or with data:{} instead.

The foreground code is as follows:
Copy Code code as follows:

<span style= "White-space:pre" > </span>var checkvalue=$ ("#s1"). Val ();

Copy Code code as follows:

<span style= "White-space:pre" > </span>//this var is the S1 value of the select selected Opention that gets the ID q
$
. Ajax ({
Type: "Post",
URL: "Getshowdatalist.do",
Async:true,
Data:{data: ""}, this can also
Data:
"Filepath=" +checkvalue

Copy Code code as follows:

<span style= "White-space:pre" > </span>//data: The data is passed to the background, where the data format is JSON format
,
DataType: "JSON",
Error:function () {
alert (CheckValue);
Alert (' Load failed! ');
},
Success:function (JSON) {

Copy Code code as follows:

<span style= "White-space:pre" > </span>//JSON here is the data that is passed backstage, where the data format is also JSON format.

The foreground gets the background of the JSON format list dataset, which is written in the function
Copy Code code as follows:

var points = [];//Create 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 Code code as follows:

Public Actionforward Execute (actionmapping mapping, Actionform form,
HttpServletRequest request, HttpServletResponse response) {

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

Copy Code code as follows:

<span style= "White-space:pre" > </span>//get Reception delivered by filepath
SYSTEM.OUT.PRINTLN (filepath);

list<show> DataList = Getshowdata (filepath);

Response.setcontenttype ("Appliction/json;charset=utf-8");
Jsonarray Jsonarray = Jsonarray.fromobject (DataList);

Copy Code code 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;
}
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.