Jquery, JSON, and struts2 Integrated Development (Implementation drop-down list)

Source: Internet
Author: User

Jquery

Jquery is another excellent Javascr into pt framework after prototype. It is a lightweight js Library (only 21 k after compression). It is compatible with CSS3 and various browsers (IE 6.0 +, FF 1.5 +, Safari 2.0 +, and Opera 9.0 + ). JQuery allows you to easily process HTML documents, events, and animation effects, and provides AJAX interaction for websites. Another major advantage of jQuery is its comprehensive documentation and detailed description of various applications. There are also many mature plug-ins to choose from. JQuery can ensure that the user's html page is separated from the code and html content. That is to say, you don't need to insert a bunch of JavaScript code in the html to call the command. You just need to define the id.

Json

JSON (JavaScript Object Notation) is a lightweight data exchange format. It is based on a subset of JavaScript (Standard ECMA-262 3rd Edition-December 1999. JSON uses a completely language-independent text format, but it also uses a habit similar to the C language family (including C, C ++, C #, Java, JavaScript, Perl, Python, and so on ). These features make JSON an ideal data exchange language. Easy for reading and writing, and easy for machine parsing and generation.

Struts 2

Struts2 is the next-generation product of Struts. It is a new struts 2 framework that is merged Based on Struts and webwork technologies. The new architecture of struts 2 is significantly different from that of struts 1. Struts 2 uses webwork as the core and the interceptor mechanism to process users' requests. This design also enables the business logic controller to completely remove from the servlet API, therefore, Struts 2 can be understood as a webwork update product. Although there are many changes from struts 1 to struts 2
2. There is only a small change.

The whole process of integration is as follows:

Environment Configuration:

In myeclipse9, you can directly add the core package of struts2:

It includes:

Download another package from the Internet:

This integrates JSON and struts2. Jquery only needs to include jquery. js.

The Code is as follows:

The Action Method in struts2 is as follows:

Public String queryAllInstitutes () {try {// query the ArrayList of all schools <Institute> Institutes = instituteService. queryAllInstitute (); // defines the Iterator and traverses the set Iterator <Institute> itr = Institutes. iterator (); JSONArray jsonArray = new JSONArray (); while (itr. hasNext () {Institute ins = (Institute) itr. next (); // Add the number and name of each school to the json object JSONObject temp = new JSONObject (). element ("instituteNo", ins. getInstituteNo ()). element ("Custom utename", ins. getjsonutename (); // Add the json object to a json array. add (temp);} HttpServletResponse response = ServletActionContext. getResponse (); response. setContentType ("text/html"); response. setCharacterEncoding ("UTF-8"); // convert json data into string and output to client response. getWriter (). print (jsonArray. toString ();} catch (Throwable e) {e. printStackTrace ();} return null ;}

Code in struts. xml:

<Action name = "showAllInstitute" class = "net. hncu. struts2.action. ShowAllInstituteAction" method = "queryAllInstitutes"> <! -- Define the relationship between processing results and view resources --> </action>

ShowAllInsitute. js

$ (Document ). ready (function () {/* obtain the school name */$. post ("showAllInstitute. action ", function (data) {alert (data); var jsonObj = eval (" ("+ data +") "); for (var I = 0; I <jsonObj. length; I ++) {var $ option = $ ("<option> </option>"); $ option. attr ("value", jsonObj [I]. optional uteno); $ option. text (jsonObj [I]. instituteName); $ ("# institute "). append ($ option );}});});

AddMajor. jsp

<% @ Page contenttype = "text/html; charset = gb2312 "%> <script language =" JavaScript "src =" JS/jquery-1.6.3.js "> </SCRIPT> <SCRIPT type =" text/JavaScript "src =" JS/showallinstitute. JS "> </SCRIPT> <HTML> 

The final result is as follows:

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.