`
hslh22
  • 浏览: 78153 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

struts2 json jquery 异步

jsonjQueryStrutsAjaxJavaScript 
阅读更多
2011-02-16

struts2 json jquery 异步

文章分类:Java编程
2010-06-03
Struts2+jQuery+JSON实现异步交互
文章分类:Java编程
Struts2+JQuery+JSON实现异步交互，包括从后台获得单个值、对象、List和Map数据并从前台的表达中获取值把值进行序列化通过JQuery的$.ajax({})传到后台和后台的对象进行绑定。

第一步：在MyEclipse中创建JavaWeb工厂并把Struts2 和 json的jar包添加到工程中添加完成后的工程图是：



第二步：创建后台：

  1. UserInfo实体类：

 

Userinfo实体类代码 
1.package struts2jsonjquery.test.entity;  
2. 
3.import java.io.Serializable;  
4./**  
5. * <p>  
6. *  用户实体类  
7. * </p>  
8. * @author 朱延伟  
9. *  
10. */  
11.public class UserInfo implements Serializable {  
12. 
13.    private static final long serialVersionUID = 3952189513312630860L;  
14.      
15.    private int userId;  
16.    private String userName;  
17.    private String password;  
18.    public int getUserId() {  
19.        return userId;  
20.    }  
21.    public void setUserId(int userId) {  
22.        this.userId = userId;  
23.    }  
24.    public String getUserName() {  
25.        return userName;  
26.    }  
27.    public void setUserName(String userName) {  
28.        this.userName = userName;  
29.    }  
30.    public String getPassword() {  
31.        return password;  
32.    }  
33.    public void setPassword(String password) {  
34.        this.password = password;  
35.    }  
36.} 
Userinfo实体类代码
1.package struts2jsonjquery.test.entity;  
2. 
3.import java.io.Serializable;  
4./**  
5. * <p>  
6. *  用户实体类  
7. * </p>  
8. * @author 朱延伟  
9. *  
10. */  
11.public class UserInfo implements Serializable {  
12. 
13.    private static final long serialVersionUID = 3952189513312630860L;  
14.      
15.    private int userId;  
16.    private String userName;  
17.    private String password;  
18.    public int getUserId() {  
19.        return userId;  
20.    }  
21.    public void setUserId(int userId) {  
22.        this.userId = userId;  
23.    }  
24.    public String getUserName() {  
25.        return userName;  
26.    }  
27.    public void setUserName(String userName) {  
28.        this.userName = userName;  
29.    }  
30.    public String getPassword() {  
31.        return password;  
32.    }  
33.    public void setPassword(String password) {  
34.        this.password = password;  
35.    }  
36.} 
package struts2jsonjquery.test.entity;

import java.io.Serializable;
/**
* <p>
* 用户实体类
* </p>
* @author 朱延伟
*
*/
public class UserInfo implements Serializable {

private static final long serialVersionUID = 3952189513312630860L;

private int userId;
private String userName;
private String password;
public int getUserId() {
return userId;
}
public void setUserId(int userId) {
this.userId = userId;
}
public String getUserName() {
return userName;
}
public void setUserName(String userName) {
this.userName = userName;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}


2. Action类

Action类代码 
1.package struts2jsonjquery.test.action;  
2. 
3.import java.util.ArrayList;  
4.import java.util.HashMap;  
5.import java.util.List;  
6.import java.util.Map;  
7. 
8.import struts2jsonjquery.test.entity.UserInfo;  
9. 
10.import com.opensymphony.xwork2.ActionSupport;  
11. 
12.public class JsonJqueryStruts2Action extends ActionSupport {  
13. 
14.    private static final long serialVersionUID = 3518833679938898354L;  
15.      
16.    private String message;     //使用json返回单个值  
17.    private UserInfo userInfo;      //使用json返回对象  
18.    private List<UserInfo> userInfosList;     //使用josn返回List对象  
19.    private Map<String,UserInfo> userInfosMap;    //使用json返回Map对象  
20.    //为上面的的属性提供get，Set方法  
21.    public String getMessage() {  
22.        return message;  
23.    }  
24.    public void setMessage(String message) {  
25.        this.message = message;  
26.    }  
27.    public UserInfo getUserInfo() {  
28.        return userInfo;  
29.    }  
30.    public void setUserInfo(UserInfo userInfo) {  
31.        this.userInfo = userInfo;  
32.    }  
33.    public List<UserInfo> getUserInfosList() {  
34.        return userInfosList;  
35.    }  
36.    public void setUserInfosList(List<UserInfo> userInfosList) {  
37.        this.userInfosList = userInfosList;  
38.    }  
39.    public Map<String, UserInfo> getUserInfosMap() {  
40.        return userInfosMap;  
41.    }  
42.    public void setUserInfosMap(Map<String, UserInfo> userInfosMap) {  
43.        this.userInfosMap = userInfosMap;  
44.    }  
45.    /**  
46.     * <p>  
47.     *  返回单个值  
48.     * <p>  
49.     * @return  
50.     */  
51.    public String returnMessage(){  
52.        this.message = "成功返回单个值";   
53.        return "message";   
54.    }  
55.    /**  
56.     * <p>  
57.     *  返回UserInfo对象  
58.     * </p>  
59.     * @return  
60.     */  
61.    public String returnUserInfo(){  
62.        userInfo = new UserInfo();  
63.        userInfo.setUserId(10000);   
64.        userInfo.setUserName("张三");   
65.        userInfo.setPassword("000000");   
66.        return "userInfo";   
67.    }  
68.    /**  
69.     * <p>  
70.     *  返回List对象  
71.     * </p>  
72.     * @return  
73.     */  
74.    public String returnList(){  
75.        userInfosList = new ArrayList<UserInfo>();  
76.        UserInfo u1 = new UserInfo();  
77.        u1.setUserId(10000);   
78.        u1.setUserName("张三");   
79.        u1.setPassword("000000");   
80.        UserInfo u2 = new UserInfo();  
81.        u2.setUserId(10001);   
82.        u2.setUserName("李四");   
83.        u2.setPassword("111111");   
84.        UserInfo u3 = new UserInfo();  
85.        u3.setUserId(10002);   
86.        u3.setUserName("王五");   
87.        u3.setPassword("222222");   
88.        UserInfo u4 = new UserInfo();  
89.        u4.setUserId(10003);   
90.        u4.setUserName("赵六");   
91.        u4.setPassword("333333");   
92.        userInfosList.add(u1);  
93.        userInfosList.add(u2);  
94.        userInfosList.add(u3);  
95.        userInfosList.add(u4);  
96.        return "list";   
97.    }  
98.    /**  
99.     * <p>  
100.     *  返回Map对象  
101.     * </p>  
102.     * @return  
103.     */  
104.    public String returnMap(){  
105.        userInfosMap = new HashMap<String,UserInfo>();  
106.        UserInfo u1 = new UserInfo();  
107.        u1.setUserId(10000);   
108.        u1.setUserName("张三");   
109.        u1.setPassword("000000");   
110.        UserInfo u2 = new UserInfo();  
111.        u2.setUserId(10001);   
112.        u2.setUserName("李四");   
113.        u2.setPassword("111111");   
114.        UserInfo u3 = new UserInfo();  
115.        u3.setUserId(10002);   
116.        u3.setUserName("王五");   
117.        u3.setPassword("222222");   
118.        UserInfo u4 = new UserInfo();  
119.        u4.setUserId(10003);   
120.        u4.setUserName("赵六");   
121.        u4.setPassword("333333");   
122.        userInfosMap.put(u1.getUserId()+"", u1);   
123.        userInfosMap.put(u2.getUserId()+"", u2);   
124.        userInfosMap.put(u3.getUserId()+"", u3);   
125.        userInfosMap.put(u4.getUserId()+"", u4);   
126.        return "map";   
127.    }  
128.    /**  
129.     * <p>  
130.     *  获得对象，也就是通过表达获得对象(异步的)  
131.     * </P>  
132.     * @return  
133.     */  
134.    public String gainUserInfo(){  
135.        System.out.println("用户ID："+userInfo.getUserId());   
136.        System.out.println("用户名："+userInfo.getUserName());   
137.        System.out.println("密码："+userInfo.getPassword());   
138.        return "userInfo";   
139.    }  
140.    /**  
141.     * 获得单个值就不用写了和平常一样  
142.     */  
143.} 
Action类代码
1.package struts2jsonjquery.test.action;  
2. 
3.import java.util.ArrayList;  
4.import java.util.HashMap;  
5.import java.util.List;  
6.import java.util.Map;  
7. 
8.import struts2jsonjquery.test.entity.UserInfo;  
9. 
10.import com.opensymphony.xwork2.ActionSupport;  
11. 
12.public class JsonJqueryStruts2Action extends ActionSupport {  
13. 
14.    private static final long serialVersionUID = 3518833679938898354L;  
15.      
16.    private String message;     //使用json返回单个值  
17.    private UserInfo userInfo;      //使用json返回对象  
18.    private List<UserInfo> userInfosList;     //使用josn返回List对象  
19.    private Map<String,UserInfo> userInfosMap;    //使用json返回Map对象  
20.    //为上面的的属性提供get，Set方法  
21.    public String getMessage() {  
22.        return message;  
23.    }  
24.    public void setMessage(String message) {  
25.        this.message = message;  
26.    }  
27.    public UserInfo getUserInfo() {  
28.        return userInfo;  
29.    }  
30.    public void setUserInfo(UserInfo userInfo) {  
31.        this.userInfo = userInfo;  
32.    }  
33.    public List<UserInfo> getUserInfosList() {  
34.        return userInfosList;  
35.    }  
36.    public void setUserInfosList(List<UserInfo> userInfosList) {  
37.        this.userInfosList = userInfosList;  
38.    }  
39.    public Map<String, UserInfo> getUserInfosMap() {  
40.        return userInfosMap;  
41.    }  
42.    public void setUserInfosMap(Map<String, UserInfo> userInfosMap) {  
43.        this.userInfosMap = userInfosMap;  
44.    }  
45.    /**  
46.     * <p>  
47.     *  返回单个值  
48.     * <p>  
49.     * @return  
50.     */  
51.    public String returnMessage(){  
52.        this.message = "成功返回单个值";  
53.        return "message";  
54.    }  
55.    /**  
56.     * <p>  
57.     *  返回UserInfo对象  
58.     * </p>  
59.     * @return  
60.     */  
61.    public String returnUserInfo(){  
62.        userInfo = new UserInfo();  
63.        userInfo.setUserId(10000);  
64.        userInfo.setUserName("张三");  
65.        userInfo.setPassword("000000");  
66.        return "userInfo";  
67.    }  
68.    /**  
69.     * <p>  
70.     *  返回List对象  
71.     * </p>  
72.     * @return  
73.     */  
74.    public String returnList(){  
75.        userInfosList = new ArrayList<UserInfo>();  
76.        UserInfo u1 = new UserInfo();  
77.        u1.setUserId(10000);  
78.        u1.setUserName("张三");  
79.        u1.setPassword("000000");  
80.        UserInfo u2 = new UserInfo();  
81.        u2.setUserId(10001);  
82.        u2.setUserName("李四");  
83.        u2.setPassword("111111");  
84.        UserInfo u3 = new UserInfo();  
85.        u3.setUserId(10002);  
86.        u3.setUserName("王五");  
87.        u3.setPassword("222222");  
88.        UserInfo u4 = new UserInfo();  
89.        u4.setUserId(10003);  
90.        u4.setUserName("赵六");  
91.        u4.setPassword("333333");  
92.        userInfosList.add(u1);  
93.        userInfosList.add(u2);  
94.        userInfosList.add(u3);  
95.        userInfosList.add(u4);  
96.        return "list";  
97.    }  
98.    /**  
99.     * <p>  
100.     *  返回Map对象  
101.     * </p>  
102.     * @return  
103.     */  
104.    public String returnMap(){  
105.        userInfosMap = new HashMap<String,UserInfo>();  
106.        UserInfo u1 = new UserInfo();  
107.        u1.setUserId(10000);  
108.        u1.setUserName("张三");  
109.        u1.setPassword("000000");  
110.        UserInfo u2 = new UserInfo();  
111.        u2.setUserId(10001);  
112.        u2.setUserName("李四");  
113.        u2.setPassword("111111");  
114.        UserInfo u3 = new UserInfo();  
115.        u3.setUserId(10002);  
116.        u3.setUserName("王五");  
117.        u3.setPassword("222222");  
118.        UserInfo u4 = new UserInfo();  
119.        u4.setUserId(10003);  
120.        u4.setUserName("赵六");  
121.        u4.setPassword("333333");  
122.        userInfosMap.put(u1.getUserId()+"", u1);  
123.        userInfosMap.put(u2.getUserId()+"", u2);  
124.        userInfosMap.put(u3.getUserId()+"", u3);  
125.        userInfosMap.put(u4.getUserId()+"", u4);  
126.        return "map";  
127.    }  
128.    /**  
129.     * <p>  
130.     *  获得对象，也就是通过表达获得对象(异步的)  
131.     * </P>  
132.     * @return  
133.     */  
134.    public String gainUserInfo(){  
135.        System.out.println("用户ID："+userInfo.getUserId());  
136.        System.out.println("用户名："+userInfo.getUserName());  
137.        System.out.println("密码："+userInfo.getPassword());  
138.        return "userInfo";  
139.    }  
140.    /**  
141.     * 获得单个值就不用写了和平常一样  
142.     */  
143.} 
package struts2jsonjquery.test.action;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import struts2jsonjquery.test.entity.UserInfo;

import com.opensymphony.xwork2.ActionSupport;

public class JsonJqueryStruts2Action extends ActionSupport {

private static final long serialVersionUID = 3518833679938898354L;

private String message; //使用json返回单个值
private UserInfo userInfo; //使用json返回对象
private List<UserInfo> userInfosList; //使用josn返回List对象
private Map<String,UserInfo> userInfosMap; //使用json返回Map对象
//为上面的的属性提供get，Set方法
public String getMessage() {
return message;
}
public void setMessage(String message) {
this.message = message;
}
public UserInfo getUserInfo() {
return userInfo;
}
public void setUserInfo(UserInfo userInfo) {
this.userInfo = userInfo;
}
public List<UserInfo> getUserInfosList() {
return userInfosList;
}
public void setUserInfosList(List<UserInfo> userInfosList) {
this.userInfosList = userInfosList;
}
public Map<String, UserInfo> getUserInfosMap() {
return userInfosMap;
}
public void setUserInfosMap(Map<String, UserInfo> userInfosMap) {
this.userInfosMap = userInfosMap;
}
/**
* <p>
* 返回单个值
* <p>
* @return
*/
public String returnMessage(){
this.message = "成功返回单个值";
return "message";
}
/**
* <p>
* 返回UserInfo对象
* </p>
* @return
*/
public String returnUserInfo(){
userInfo = new UserInfo();
userInfo.setUserId(10000);
userInfo.setUserName("张三");
userInfo.setPassword("000000");
return "userInfo";
}
/**
* <p>
* 返回List对象
* </p>
* @return
*/
public String returnList(){
userInfosList = new ArrayList<UserInfo>();
UserInfo u1 = new UserInfo();
u1.setUserId(10000);
u1.setUserName("张三");
u1.setPassword("000000");
UserInfo u2 = new UserInfo();
u2.setUserId(10001);
u2.setUserName("李四");
u2.setPassword("111111");
UserInfo u3 = new UserInfo();
u3.setUserId(10002);
u3.setUserName("王五");
u3.setPassword("222222");
UserInfo u4 = new UserInfo();
u4.setUserId(10003);
u4.setUserName("赵六");
u4.setPassword("333333");
userInfosList.add(u1);
userInfosList.add(u2);
userInfosList.add(u3);
userInfosList.add(u4);
return "list";
}
/**
* <p>
* 返回Map对象
* </p>
* @return
*/
public String returnMap(){
userInfosMap = new HashMap<String,UserInfo>();
UserInfo u1 = new UserInfo();
u1.setUserId(10000);
u1.setUserName("张三");
u1.setPassword("000000");
UserInfo u2 = new UserInfo();
u2.setUserId(10001);
u2.setUserName("李四");
u2.setPassword("111111");
UserInfo u3 = new UserInfo();
u3.setUserId(10002);
u3.setUserName("王五");
u3.setPassword("222222");
UserInfo u4 = new UserInfo();
u4.setUserId(10003);
u4.setUserName("赵六");
u4.setPassword("333333");
userInfosMap.put(u1.getUserId()+"", u1);
userInfosMap.put(u2.getUserId()+"", u2);
userInfosMap.put(u3.getUserId()+"", u3);
userInfosMap.put(u4.getUserId()+"", u4);
return "map";
}
/**
* <p>
* 获得对象，也就是通过表达获得对象(异步的)
* </P>
* @return
*/
public String gainUserInfo(){
System.out.println("用户ID："+userInfo.getUserId());
System.out.println("用户名："+userInfo.getUserName());
System.out.println("密码："+userInfo.getPassword());
return "userInfo";
}
/**
* 获得单个值就不用写了和平常一样
*/
}


3.  struts.xml



Struts.xml代码 
1.<?xml version="1.0" encoding="UTF-8" ?>  
2.<!DOCTYPE struts PUBLIC  
3.    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"  
4.    "http://struts.apache.org/dtds/struts-2.0.dtd">   
5. 
6.<struts>  
7. 
8.    <package name="default" namespace="/" extends="json-default">   
9.        <action name="jsontest" class="struts2jsonjquery.test.action.JsonJqueryStruts2Action">   
10.            <!-- 返回单个值的result -->  
11.            <result name="message" type="json"></result>   
12.            <!-- 返回UserInfo对象的 -->  
13.            <result name="userInfo" type="json"></result>   
14.            <!-- 返回List对象的 -->  
15.            <result name="list" type="json"></result>   
16.            <!-- 返回Map对象的 -->  
17.            <result name="map" type="json"></result>   
18.        </action>  
19.    </package>  
20.</struts> 
Struts.xml代码
1.<?xml version="1.0" encoding="UTF-8" ?>  
2.<!DOCTYPE struts PUBLIC  
3.    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN" 
4.    "http://struts.apache.org/dtds/struts-2.0.dtd">  
5. 
6.<struts>  
7. 
8.    <package name="default" namespace="/" extends="json-default">  
9.        <action name="jsontest" class="struts2jsonjquery.test.action.JsonJqueryStruts2Action">  
10.            <!-- 返回单个值的result -->  
11.            <result name="message" type="json"></result>  
12.            <!-- 返回UserInfo对象的 -->  
13.            <result name="userInfo" type="json"></result>  
14.            <!-- 返回List对象的 -->  
15.            <result name="list" type="json"></result>  
16.            <!-- 返回Map对象的 -->  
17.            <result name="map" type="json"></result>  
18.        </action>  
19.    </package>  
20.</struts> 
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
    "http://struts.apache.org/dtds/struts-2.0.dtd">

<struts>

    <package name="default" namespace="/" extends="json-default">
    <action name="jsontest" class="struts2jsonjquery.test.action.JsonJqueryStruts2Action">
    <!-- 返回单个值的result -->
    <result name="message" type="json"></result>
    <!-- 返回UserInfo对象的 -->
    <result name="userInfo" type="json"></result>
    <!-- 返回List对象的 -->
    <result name="list" type="json"></result>
    <!-- 返回Map对象的 -->
    <result name="map" type="json"></result>
    </action>
    </package>
</struts>


前台：

1.  index.jsp

Html代码 
1.<%@ page language="java" pageEncoding="GBK"%> 
2.<%   
3.    String path = request.getContextPath();   
4.%>  
5. 
6.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
7.<html>  
8.  <head>  
9.      
10.    <title>Struts2+JQuery+JSON</title>  
11.    <meta http-equiv="pragma" content="no-cache">  
12.    <meta http-equiv="cache-control" content="no-cache">  
13.    <meta http-equiv="expires" content="0">       
14.    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
15.    <meta http-equiv="description" content="This is my page">  
16.    <script type="text/javascript" src="<%=path %>/js/jquery.js"></script>  
17.    <script type="text/javascript" src="<%=path %>/js/json.js"></script>  
18.  </head>  
19.    
20.  <body>  
21.    <input id="getMessage" type="button" value="获取单个值"/>&nbsp;&nbsp;   
22.    <input id="getUserInfo" type="button" value="获取UserInfo对象"/>&nbsp;&nbsp;   
23.    <input id="getList" type="button" value="获取List对象"/>&nbsp;&nbsp;   
24.    <input id="getMap" type="button" value="获取Map对象"/>&nbsp;&nbsp;   
25.    <br>  
26.    <br>  
27.    <br>  
28.    <!-- 要显示信息的层 -->  
29.    <div id="message"></div>  
30.    <form>  
31.        用户ID：<input name="userInfo.userId" type="text"/><br/>  
32.        用户名：<input name="userInfo.userName" type="text"/><br/>  
33.        密&nbsp;&nbsp;&nbsp;码：<input name="userInfo.password" type="text"/><br>  
34.        <input id="regRe" type="button" value="注册"/>  
35.    </form>  
36.  </body>  
37.</html>  
Html代码
1.<%@ page language="java" pageEncoding="GBK"%> 
2.<%  
3.    String path = request.getContextPath();  
4.%> 
5. 
6.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
7.<html> 
8.  <head> 
9.      
10.    <title>Struts2+JQuery+JSON</title> 
11.    <meta http-equiv="pragma" content="no-cache"> 
12.    <meta http-equiv="cache-control" content="no-cache"> 
13.    <meta http-equiv="expires" content="0">      
14.    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
15.    <meta http-equiv="description" content="This is my page"> 
16.    <script type="text/javascript" src="<%=path %>/js/jquery.js"></script> 
17.    <script type="text/javascript" src="<%=path %>/js/json.js"></script> 
18.  </head> 
19.    
20.  <body> 
21.    <input id="getMessage" type="button" value="获取单个值"/>&nbsp;&nbsp;  
22.    <input id="getUserInfo" type="button" value="获取UserInfo对象"/>&nbsp;&nbsp;  
23.    <input id="getList" type="button" value="获取List对象"/>&nbsp;&nbsp;  
24.    <input id="getMap" type="button" value="获取Map对象"/>&nbsp;&nbsp;  
25.    <br> 
26.    <br> 
27.    <br> 
28.    <!-- 要显示信息的层 --> 
29.    <div id="message"></div> 
30.    <form> 
31.        用户ID：<input name="userInfo.userId" type="text"/><br/> 
32.        用户名：<input name="userInfo.userName" type="text"/><br/> 
33.        密&nbsp;&nbsp;&nbsp;码：<input name="userInfo.password" type="text"/><br> 
34.        <input id="regRe" type="button" value="注册"/> 
35.    </form> 
36.  </body> 
37.</html> 
<%@ page language="java" pageEncoding="GBK"%>
<%
String path = request.getContextPath();
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
   
    <title>Struts2+JQuery+JSON</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">   
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script type="text/javascript" src="<%=path %>/js/jquery.js"></script>
<script type="text/javascript" src="<%=path %>/js/json.js"></script>
  </head>
 
  <body>
    <input id="getMessage" type="button" value="获取单个值"/>&nbsp;&nbsp;
    <input id="getUserInfo" type="button" value="获取UserInfo对象"/>&nbsp;&nbsp;
    <input id="getList" type="button" value="获取List对象"/>&nbsp;&nbsp;
    <input id="getMap" type="button" value="获取Map对象"/>&nbsp;&nbsp;
    <br>
    <br>
    <br>
    <!-- 要显示信息的层 -->
    <div id="message"></div>
    <form>
    用户ID：<input name="userInfo.userId" type="text"/><br/>
    用户名：<input name="userInfo.userName" type="text"/><br/>
    密&nbsp;&nbsp;&nbsp;码：<input name="userInfo.password" type="text"/><br>
    <input id="regRe" type="button" value="注册"/>
    </form>
  </body>
</html>


2. json.js

 

Js代码 
1.//初始加载页面时  
2.$(document).ready(function(){   
3. //为获取单个值的按钮注册鼠标单击事件   
4. $("#getMessage").click(function(){   
5.  $.getJSON("jsontest!returnMessage.action",function(data){   
6.   //通过.操作符可以从data.message中获得Action中message的值   
7.   $("#message").html("<font color='red'>"+data.message+"</font>");   
8.  });  
9. });  
10. //为获取UserInfo对象按钮添加鼠标单击事件   
11. $("#getUserInfo").click(function(){   
12.  $.getJSON("jsontest!returnUserInfo.action",function(data){   
13.   //清空显示层中的数据   
14.   $("#message").html("");   
15.   //为显示层添加获取到的数据   
16.   //获取对象的数据用data.userInfo.属性   
17.   $("#message").append("<div><font color='red'>用户ID："+data.userInfo.userId+"</font></div>")   
18.          .append("<div><font color='red'>用户名："+data.userInfo.userName+"</font></div>")   
19.          .append("<div><font color='red'>密码："+data.userInfo.password+"</font></div>")   
20.  });  
21. });  
22. //为获取List对象按钮添加鼠标单击事件   
23. $("#getList").click(function(){   
24.  $.getJSON("jsontest!returnList.action",function(data){   
25.   //清空显示层中的数据   
26.   $("#message").html("");   
27.   //使用jQuery中的each(data,function(){});函数   
28.   //从data.userInfosList获取UserInfo对象放入value之中   
29.   $.each(data.userInfosList,function(i,value){   
30.    $("#message").append("<div>第"+(i+1)+"个用户：</div>")   
31.       .append("<div><font color='red'>用户ID："+value.userId+"</font></div>")   
32.          .append("<div><font color='red'>用户名："+value.userName+"</font></div>")   
33.          .append("<div><font color='red'>密码："+value.password+"</font></div>");   
34.   });  
35.  });  
36. });  
37. //为获取Map对象按钮添加鼠标单击事件   
38. $("#getMap").click(function(){   
39.  $.getJSON("jsontest!returnMap.action",function(data){   
40.   //清空显示层中的数据   
41.   $("#message").html("");   
42.   //使用jQuery中的each(data,function(){});函数   
43.   //从data.userInfosList获取UserInfo对象放入value之中   
44.   //key值为Map的键值   
45.   $.each(data.userInfosMap,function(key,value){   
46.    $("#message").append("<div><font color='red'>用户ID："+value.userId+"</font></div>")   
47.          .append("<div><font color='red'>用户名："+value.userName+"</font></div>")   
48.          .append("<div><font color='red'>密码："+value.password+"</font></div>");   
49.   });  
50.  });  
51. });  
52. //向服务器发送表达数据   
53. $("#regRe").click(function(){   
54.  //把表单的数据进行序列化   
55.  var params = $("form").serialize();   
56.  //使用jQuery中的$.ajax({});Ajax方法   
57.  $.ajax({  
58.   url:"jsontest!gainUserInfo.action",   
59.   type:"POST",   
60.   data:params,  
61.   dataType:"json",   
62.   success:function(data){   
63.    //清空显示层中的数据   
64.   $("#message").html("");   
65.   //为显示层添加获取到的数据   
66.   //获取对象的数据用data.userInfo.属性   
67.   $("#message").append("<div><font color='red'>用户ID："+data.userInfo.userId+"</font></div>")   
68.          .append("<div><font color='red'>用户名："+data.userInfo.userName+"</font></div>")   
69.          .append("<div><font color='red'>密码："+data.userInfo.password+"</font></div>")   
70.   }  
71.  });  
72. });  
73.}); 
Js代码
1.//初始加载页面时  
2.$(document).ready(function(){  
3. //为获取单个值的按钮注册鼠标单击事件  
4. $("#getMessage").click(function(){  
5.  $.getJSON("jsontest!returnMessage.action",function(data){  
6.   //通过.操作符可以从data.message中获得Action中message的值  
7.   $("#message").html("<font color='red'>"+data.message+"</font>");  
8.  });  
9. });  
10. //为获取UserInfo对象按钮添加鼠标单击事件  
11. $("#getUserInfo").click(function(){  
12.  $.getJSON("jsontest!returnUserInfo.action",function(data){  
13.   //清空显示层中的数据  
14.   $("#message").html("");  
15.   //为显示层添加获取到的数据  
16.   //获取对象的数据用data.userInfo.属性  
17.   $("#message").append("<div><font color='red'>用户ID："+data.userInfo.userId+"</font></div>")  
18.          .append("<div><font color='red'>用户名："+data.userInfo.userName+"</font></div>")  
19.          .append("<div><font color='red'>密码："+data.userInfo.password+"</font></div>")  
20.  });  
21. });  
22. //为获取List对象按钮添加鼠标单击事件  
23. $("#getList").click(function(){  
24.  $.getJSON("jsontest!returnList.action",function(data){  
25.   //清空显示层中的数据  
26.   $("#message").html("");  
27.   //使用jQuery中的each(data,function(){});函数  
28.   //从data.userInfosList获取UserInfo对象放入value之中  
29.   $.each(data.userInfosList,function(i,value){  
30.    $("#message").append("<div>第"+(i+1)+"个用户：</div>")  
31.       .append("<div><font color='red'>用户ID："+value.userId+"</font></div>")  
32.          .append("<div><font color='red'>用户名："+value.userName+"</font></div>")  
33.          .append("<div><font color='red'>密码："+value.password+"</font></div>");  
34.   });  
35.  });  
36. });  
37. //为获取Map对象按钮添加鼠标单击事件  
38. $("#getMap").click(function(){  
39.  $.getJSON("jsontest!returnMap.action",function(data){  
40.   //清空显示层中的数据  
41.   $("#message").html("");  
42.   //使用jQuery中的each(data,function(){});函数  
43.   //从data.userInfosList获取UserInfo对象放入value之中  
44.   //key值为Map的键值  
45.   $.each(data.userInfosMap,function(key,value){  
46.    $("#message").append("<div><font color='red'>用户ID："+value.userId+"</font></div>")  
47.          .append("<div><font color='red'>用户名："+value.userName+"</font></div>")  
48.          .append("<div><font color='red'>密码："+value.password+"</font></div>");  
49.   });  
50.  });  
51. });  
52. //向服务器发送表达数据  
53. $("#regRe").click(function(){  
54.  //把表单的数据进行序列化  
55.  var params = $("form").serialize();  
56.  //使用jQuery中的$.ajax({});Ajax方法  
57.  $.ajax({  
58.   url:"jsontest!gainUserInfo.action",  
59.   type:"POST",  
60.   data:params,  
61.   dataType:"json",  
62.   success:function(data){  
63.    //清空显示层中的数据  
64.   $("#message").html("");  
65.   //为显示层添加获取到的数据  
66.   //获取对象的数据用data.userInfo.属性  
67.   $("#message").append("<div><font color='red'>用户ID："+data.userInfo.userId+"</font></div>")  
68.          .append("<div><font color='red'>用户名："+data.userInfo.userName+"</font></div>")  
69.          .append("<div><font color='red'>密码："+data.userInfo.password+"</font></div>")  
70.   }  
71.  });  
72. });  
73.}); 
//初始加载页面时
$(document).ready(function(){
//为获取单个值的按钮注册鼠标单击事件
$("#getMessage").click(function(){
  $.getJSON("jsontest!returnMessage.action",function(data){
   //通过.操作符可以从data.message中获得Action中message的值
   $("#message").html("<font color='red'>"+data.message+"</font>");
  });
});
//为获取UserInfo对象按钮添加鼠标单击事件
$("#getUserInfo").click(function(){
  $.getJSON("jsontest!returnUserInfo.action",function(data){
   //清空显示层中的数据
   $("#message").html("");
   //为显示层添加获取到的数据
   //获取对象的数据用data.userInfo.属性
   $("#message").append("<div><font color='red'>用户ID："+data.userInfo.userId+"</font></div>")
          .append("<div><font color='red'>用户名："+data.userInfo.userName+"</font></div>")
          .append("<div><font color='red'>密码："+data.userInfo.password+"</font></div>")
  });
});
//为获取List对象按钮添加鼠标单击事件
$("#getList").click(function(){
  $.getJSON("jsontest!returnList.action",function(data){
   //清空显示层中的数据
   $("#message").html("");
   //使用jQuery中的each(data,function(){});函数
   //从data.userInfosList获取UserInfo对象放入value之中
   $.each(data.userInfosList,function(i,value){
    $("#message").append("<div>第"+(i+1)+"个用户：</div>")
       .append("<div><font color='red'>用户ID："+value.userId+"</font></div>")
          .append("<div><font color='red'>用户名："+value.userName+"</font></div>")
          .append("<div><font color='red'>密码："+value.password+"</font></div>");
   });
  });
});
//为获取Map对象按钮添加鼠标单击事件
$("#getMap").click(function(){
  $.getJSON("jsontest!returnMap.action",function(data){
   //清空显示层中的数据
   $("#message").html("");
   //使用jQuery中的each(data,function(){});函数
   //从data.userInfosList获取UserInfo对象放入value之中
   //key值为Map的键值
   $.each(data.userInfosMap,function(key,value){
    $("#message").append("<div><font color='red'>用户ID："+value.userId+"</font></div>")
          .append("<div><font color='red'>用户名："+value.userName+"</font></div>")
          .append("<div><font color='red'>密码："+value.password+"</font></div>");
   });
  });
});
//向服务器发送表达数据
$("#regRe").click(function(){
  //把表单的数据进行序列化
  var params = $("form").serialize();
  //使用jQuery中的$.ajax({});Ajax方法
  $.ajax({
   url:"jsontest!gainUserInfo.action",
   type:"POST",
   data:params,
   dataType:"json",
   success:function(data){
    //清空显示层中的数据
   $("#message").html("");
   //为显示层添加获取到的数据
   //获取对象的数据用data.userInfo.属性
   $("#message").append("<div><font color='red'>用户ID："+data.userInfo.userId+"</font></div>")
          .append("<div><font color='red'>用户名："+data.userInfo.userName+"</font></div>")
          .append("<div><font color='red'>密码："+data.userInfo.password+"</font></div>")
   }
  });
});
}); 注意：JSON插件会把所有包含getter方法的属性都序列化到返回结果中，所以Action中的其他execute方法都不要把名

       字加get前缀。

可以下载工程文件

转自 http://qsfwy.iteye.com/blog/682796
分享到：
| Struts 1.x 彻底解决刷新页面时阻止重复提 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    Jquery struts2 json 实现ajax

    标题 "Jquery struts2 json 实现ajax" 涉及到的是在Web开发中使用jQuery库与Struts2框架结合处理JSON数据的Ajax技术。这个主题主要关注如何通过前端的jQuery实现异步请求，与后端的Struts2框架进行交互，从而更新...

    一个简单的struts2+json+jquery 交互的例子

    总结来说，这个例子展示了如何利用Struts2处理后端业务逻辑，使用JSON作为数据交换格式，以及通过jQuery在前端实现动态更新和与服务器的异步通信。了解和掌握这三个工具的整合使用，对于提升Web开发效率和用户体验...

    struts2 json

    5. **[原创]Struts2 + JQuery + JSON实现AJAX - Struts - Java - ITeye论坛.mht**：这个文件可能是一个论坛帖子，详细介绍了如何结合Struts2、jQuery和JSON实现AJAX功能。帖子中可能会涵盖Action配置、JSON结果类型...

    struts2+json

    这个资源"struts2+json"显然涉及到在Struts2框架下实现JSON（JavaScript Object Notation）数据交换，这是一种轻量级的数据交换格式，广泛用于前后端交互，特别是AJAX（Asynchronous JavaScript and XML）请求。...

    Struts2+jQuery（不用JSON）实现局部刷新

    - **Struts2的JSON插件**：虽然题目要求不使用JSON，但通常情况下，Struts2通过JSON插件返回数据给jQuery是最方便的方式。不过，我们可以通过设置Content-Type为"text/plain"或"text/html"，让Struts2返回非JSON...

    jQuery+json异步实现JSP和struts2之间的数据传递

    "jQuery+json异步实现JSP和struts2之间的数据传递"是一个典型的应用场景，它结合了前端JavaScript库jQuery与后端MVC框架Struts2，通过JSON这种轻量级的数据交换格式进行高效的数据交互。下面我们将详细探讨这一主题...

    struts2 整合jQuery 和 json 的全部jar包

    在Struts2环境中，jQuery可以发起异步请求到Struts2 Action，接收并处理返回的JSON数据。 3. **JSON数据交换**：在Struts2 Action中，你可以创建一个返回JSON的对象，例如： ```java public class MyAction { ...

    struts2 Ajax json Jquery demo

    在这个"struts2 Ajax json Jquery demo"中，我们将探讨这些技术如何协同工作，创建一个异步数据交换的示例。 首先，Struts2是一个基于MVC（模型-视图-控制器）架构的Java Web框架，它简化了开发过程，提供了一种...

    Struts2 与Jquery Ajax的json数据交换的典型范例

    总结，Struts2和jQuery的Ajax JSON数据交换涉及以下几个关键步骤：配置Struts2的JSON插件，编写返回JSON数据的Action，使用jQuery发起Ajax请求并处理返回的JSON数据。通过这种方式，可以实现客户端与服务器之间的...

    json-lib-2.1.jar和struts2-json-plugin-2.1.8.1.jar

    这个插件允许开发者在Struts 2中轻松地创建能够返回JSON的Action，使得前端（通常使用JavaScript库如jQuery）可以获取到JSON数据并进行进一步处理。 现在我们来详细讨论这两个库在实际应用中的作用： 1. **json-...

    Struts2_jquery_json1.0.zip_Struts2 heloword_struts2_struts2 jque

    总结来说，"Struts2_jquery_json1.0.zip"是一个综合实例，展示了如何在Struts2框架中结合使用jQuery和JSON进行异步数据交互。通过学习这个实例，开发者可以更好地理解如何在Java后端与JavaScript前端之间有效地传递...

    struts2+JQuery完整集成lib包

    5. **类库包中的其他组件**：除了Struts2和jQuery本身，这个包可能还包含了其他的依赖库，如JSON库（用于JSON数据的序列化和反序列化）、Commons Logging等，这些都是Struts2和jQuery正常工作所必需的。 6. **导入...

    struts2与json整合

    例如，在前端使用jQuery等库发起AJAX请求，获取或发送JSON格式的数据，而在后端，Struts2框架则能够无缝处理这些JSON数据，从而构建出响应迅速、用户体验优秀的Web应用。 综上所述，Struts2与JSON的整合不仅提升了...

    struts2+json+jquery实现ajax数据的存取

    "Struts2+JSON+jQuery实现Ajax数据的存取"就是一个典型的示例，它结合了强大的MVC框架Struts2、轻量级的数据交换格式JSON以及高效的前端库jQuery，以实现网页上的无刷新数据交互。下面将详细介绍这三个技术及其在...

    Struts2+Jquery+Ajax

    在Struts2框架下，我们可以使用Jquery的Ajax方法向服务器发送请求，获取JSON或XML数据，然后动态更新页面的部分内容。 在"06-mvc之struts2.ppt"中，可能涵盖了以下内容： 1. Struts2框架的基本概念和架构 2. 如何...

    AjaxStruts2Json实例

    Struts2提供了`struts2-jquery-plugin`和`struts2-json-plugin`两个插件来实现Ajax功能。在这个实例中，我们将主要使用`struts2-json-plugin`，它能够方便地将Action的结果以JSON格式返回给客户端。 1. **环境配置*...

    整合jquery+json+struts2异步提交实例

    在这个实例中，“整合jquery+json+struts2异步提交”是一个典型的前端与后端交互的示例，利用了jQuery的Ajax功能和Struts2框架处理JSON数据。下面我们将详细探讨这些技术及其相互配合的工作原理。 **jQuery** 是一...

    struts2+jquery执行ajax并返回json类型数据（源码）

    在这个"struts2+jquery执行ajax并返回json类型数据"的示例中，我们将探讨如何通过Ajax技术在后台Struts2框架与前端jQuery库之间交换JSON格式的数据。 首先，Struts2是一个强大的MVC（Model-View-Controller）框架，...

    struts2.2 项目搭建 以及与 struts2-json jquery 前后台进行交互

    - **Ajax请求**：使用jQuery库发送异步AJAX请求，例如`$.ajax()`或`$.getJSON()`，与Struts2的Action进行通信。 3. **jQuery的使用**： - **基本概念**：jQuery是一个轻量级的JavaScript库，简化了DOM操作、事件...

    Struts2JQueryJson

    Struts2JQueryJson是一个基于Struts2框架与jQuery库，结合JSON（JavaScript Object Notation）数据格式，实现Ajax异步加载对象数据的技术方案。在Web应用开发中，这种技术可以提升用户体验，因为它允许页面部分内容...

Magicbox
Global site tag (gtag.js) - Google Analytics