Struts2+JQuery+JSON实现异步交互，包括从后台获得单个值、对象、List和Map数据并从前台的表达中获取值

最新推荐文章于 2018-03-14 17:20:33 发布
最新推荐文章于 2018-03-14 17:20:33 发布
阅读量1.9k 收藏
点赞数
分类专栏： JavaEE开发

转自http://qsfwy.javaeye.com/blog/682796

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. public class UserInfo implements Serializable {   
  6.   
  7.     private static final long serialVersionUID = 3952189513312630860L;   
  8.        
  9.     private int userId;   
  10.     private String userName;   
  11.     private String password;   
  12.     public int getUserId() {   
  13.         return userId;   
  14.     }   
  15.     public void setUserId(int userId) {   
  16.         this.userId = userId;   
  17.     }   
  18.     public String getUserName() {   
  19.         return userName;   
  20.     }   
  21.     public void setUserName(String userName) {   
  22.         this.userName = userName;   
  23.     }   
  24.     public String getPassword() {   
  25.         return password;   
  26.     }   
  27.     public void setPassword(String password) {   
  28.         this.password = password;   
  29.     }   
  30. }  
Userinfo实体类代码   收藏代码
  1. package struts2jsonjquery.test.entity;  
  2.   
  3. import java.io.Serializable;  
  4.   
  5. public class UserInfo implements Serializable {  
  6.   
  7.     private static final long serialVersionUID = 3952189513312630860L;  
  8.       
  9.     private int userId;  
  10.     private String userName;  
  11.     private String password;  
  12.     public int getUserId() {  
  13.         return userId;  
  14.     }  
  15.     public void setUserId(int userId) {  
  16.         this.userId = userId;  
  17.     }  
  18.     public String getUserName() {  
  19.         return userName;  
  20.     }  
  21.     public void setUserName(String userName) {  
  22.         this.userName = userName;  
  23.     }  
  24.     public String getPassword() {  
  25.         return password;  
  26.     }  
  27.     public void setPassword(String password) {  
  28.         this.password = password;  
  29.     }  
  30. }  

 

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.     public String returnMessage(){   
  47.         this.message = "成功返回单个值";   
  48.         return "message";   
  49.     }   
  50.        
  51.     public String returnUserInfo(){   
  52.         userInfo = new UserInfo();   
  53.         userInfo.setUserId(10000);   
  54.         userInfo.setUserName("张三");   
  55.         userInfo.setPassword("000000");   
  56.         return "userInfo";   
  57.     }   
  58.        
  59.     public String returnList(){   
  60.         userInfosList = new ArrayList<UserInfo>();   
  61.         UserInfo u1 = new UserInfo();   
  62.         u1.setUserId(10000);   
  63.         u1.setUserName("张三");   
  64.         u1.setPassword("000000");   
  65.         UserInfo u2 = new UserInfo();   
  66.         u2.setUserId(10001);   
  67.         u2.setUserName("李四");   
  68.         u2.setPassword("111111");   
  69.         UserInfo u3 = new UserInfo();   
  70.         u3.setUserId(10002);   
  71.         u3.setUserName("王五");   
  72.         u3.setPassword("222222");   
  73.         UserInfo u4 = new UserInfo();   
  74.         u4.setUserId(10003);   
  75.         u4.setUserName("赵六");   
  76.         u4.setPassword("333333");   
  77.         userInfosList.add(u1);   
  78.         userInfosList.add(u2);   
  79.         userInfosList.add(u3);   
  80.         userInfosList.add(u4);   
  81.         return "list";   
  82.     }   
  83.        
  84.     public String returnMap(){   
  85.         userInfosMap = new HashMap<String,UserInfo>();   
  86.         UserInfo u1 = new UserInfo();   
  87.         u1.setUserId(10000);   
  88.         u1.setUserName("张三");   
  89.         u1.setPassword("000000");   
  90.         UserInfo u2 = new UserInfo();   
  91.         u2.setUserId(10001);   
  92.         u2.setUserName("李四");   
  93.         u2.setPassword("111111");   
  94.         UserInfo u3 = new UserInfo();   
  95.         u3.setUserId(10002);   
  96.         u3.setUserName("王五");   
  97.         u3.setPassword("222222");   
  98.         UserInfo u4 = new UserInfo();   
  99.         u4.setUserId(10003);   
  100.         u4.setUserName("赵六");   
  101.         u4.setPassword("333333");   
  102.         userInfosMap.put(u1.getUserId()+"", u1);   
  103.         userInfosMap.put(u2.getUserId()+"", u2);   
  104.         userInfosMap.put(u3.getUserId()+"", u3);   
  105.         userInfosMap.put(u4.getUserId()+"", u4);   
  106.         return "map";   
  107.     }   
  108.        
  109.     public String gainUserInfo(){   
  110.         System.out.println("用户ID："+userInfo.getUserId());   
  111.         System.out.println("用户名："+userInfo.getUserName());   
  112.         System.out.println("密码："+userInfo.getPassword());   
  113.         return "userInfo";   
  114.     }   
  115.        
  116. }  
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.     public String returnMessage(){  
  47.         this.message = "成功返回单个值";  
  48.         return "message";  
  49.     }  
  50.       
  51.     public String returnUserInfo(){  
  52.         userInfo = new UserInfo();  
  53.         userInfo.setUserId(10000);  
  54.         userInfo.setUserName("张三");  
  55.         userInfo.setPassword("000000");  
  56.         return "userInfo";  
  57.     }  
  58.       
  59.     public String returnList(){  
  60.         userInfosList = new ArrayList<UserInfo>();  
  61.         UserInfo u1 = new UserInfo();  
  62.         u1.setUserId(10000);  
  63.         u1.setUserName("张三");  
  64.         u1.setPassword("000000");  
  65.         UserInfo u2 = new UserInfo();  
  66.         u2.setUserId(10001);  
  67.         u2.setUserName("李四");  
  68.         u2.setPassword("111111");  
  69.         UserInfo u3 = new UserInfo();  
  70.         u3.setUserId(10002);  
  71.         u3.setUserName("王五");  
  72.         u3.setPassword("222222");  
  73.         UserInfo u4 = new UserInfo();  
  74.         u4.setUserId(10003);  
  75.         u4.setUserName("赵六");  
  76.         u4.setPassword("333333");  
  77.         userInfosList.add(u1);  
  78.         userInfosList.add(u2);  
  79.         userInfosList.add(u3);  
  80.         userInfosList.add(u4);  
  81.         return "list";  
  82.     }  
  83.       
  84.     public String returnMap(){  
  85.         userInfosMap = new HashMap<String,UserInfo>();  
  86.         UserInfo u1 = new UserInfo();  
  87.         u1.setUserId(10000);  
  88.         u1.setUserName("张三");  
  89.         u1.setPassword("000000");  
  90.         UserInfo u2 = new UserInfo();  
  91.         u2.setUserId(10001);  
  92.         u2.setUserName("李四");  
  93.         u2.setPassword("111111");  
  94.         UserInfo u3 = new UserInfo();  
  95.         u3.setUserId(10002);  
  96.         u3.setUserName("王五");  
  97.         u3.setPassword("222222");  
  98.         UserInfo u4 = new UserInfo();  
  99.         u4.setUserId(10003);  
  100.         u4.setUserName("赵六");  
  101.         u4.setPassword("333333");  
  102.         userInfosMap.put(u1.getUserId()+"", u1);  
  103.         userInfosMap.put(u2.getUserId()+"", u2);  
  104.         userInfosMap.put(u3.getUserId()+"", u3);  
  105.         userInfosMap.put(u4.getUserId()+"", u4);  
  106.         return "map";  
  107.     }  
  108.       
  109.     public String gainUserInfo(){  
  110.         System.out.println("用户ID："+userInfo.getUserId());  
  111.         System.out.println("用户名："+userInfo.getUserName());  
  112.         System.out.println("密码："+userInfo.getPassword());  
  113.         return "userInfo";  
  114.     }  
  115.       
  116. }  

 

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>  

 

前台：

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>  

 

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. });  

 注意：JSON插件会把所有包含getter方法的属性都序列化到返回结果中，所以Action中的其他execute方法都不要把名

       字加get前缀。

可以下载工程文件

飞向Hadoop
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
struts2+jquery+json实现异步加载数据(自写)
12-11
代码如下: //初始加载页面时 $(document).ready(function(){ //为获取单个值的按钮注册鼠标单击事件 $(“#getMessage”).click(function(){ $.getJSON(“ceshi”,function(data){ //通过.操作符可以从data.message中...
Struts2+Jquery实现ajax并返回json类型数据
shuaishuai123485615的专栏
04-17 3404
主要实现步骤如下： 1、JSP页面使用脚本代码执行ajax请求 2、Action中查询出需要返回的数据，并转换为json类型模式数据 3、配置struts.xml文件 4、页面脚本接受并处理数据 关键有如下几个点 1.引入包：struts2对数据进行json序列化，必须要用到struts2的json-lib，struts2-json-plugin包； 2.j
Struts2+jQuery+JSON实现异步交互
世范水晶
04-28 119
http://qsfwy.iteye.com/blog/682796/     http://www.cnblogs.com/linjiqin/archive/2011/03/19/1989169.html     http://aokunsang.iteye.com/blog/1014274
Struts2获取后台数据
majian_1987的专栏
03-21 2308
获取后台数据: 1.前提是后台action中有name这个属性 2. 后台中： this.addActionMessage("  "); this.addActiionError("  "); this.addFieldError("name", "name is error"); 前台用： 3.(一般用IoC代替) 后台用： private Map r
jquery 循环中得到jquery对象的 方法
fregatte的专栏
11-03 409
 $.each(checkboxArrayChecked,function (i,c){ $(this).val("haha");});
Struts2+jQuery（不用JSON）实现局部刷新
07-13
NULL 博文链接：https://left-jessica.iteye.com/blog/739878
struts2+jQuery+json实现AJAX.zip
01-24
struts2+jQuery+json实现AJAX.zip
Struts2+JSON+jQuery实现异步交互数据时选择要序列化的属性（二使用XML配置方式）
05-28
NULL 博文链接：https://zyw090111.iteye.com/blog/724574
jquery ajax 获取后台数据 （纯文本）
huihu_bird的博客
03-27 1万+
目的是为了拿到后台数据（纯文本） 通过ajax请求获取到后台数据 根据不同的到货类型获取 采购单位（后台数据） 比较重要的是 jauery ajax 的参数用法： dataType 类型：String 预期服务器返回的数据类型。如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息来智能判断，比如 XML MIME 类型就被识别为 XML。在 1
Ajax+struts2+json进行对象list前后端传递
SmallSunL的博客
12-26 2568
我们在处理前后端数据的传递过程中，经常需要从前台传入大量的数据信息与后台进行交互。 那么ajax在其中起到了关键的作用，配后后端的mvc框架，使用json信息传输信息。 在这个过程中需要将前端的对象传递至后端，本文就来介绍一下这一过程 首先js代码中我们构建一个数据对象var dataObj = { "data" : [ { "active"
Struts2+JQuery+JSON集成
风达的专栏
04-06 2万+
Struts2+JQuery+JSON集成细节部分我就不多讲了，因为我也不会，就讲讲我是如何调试出来我的第一个JSON使用的吧采用的框架有：Struts2 、 JQuery 、 JSON按着步骤来吧： 1.新建一个Web工程导入包列表： 目录结构如图： 2.建立实体类Userpackage model;pu
ajax+struts2+JQuery+json实现异步刷新
下雨了_简的博客
08-31 1361
现在分享一下ajax+struts+JQuery+json的异步刷新实现方法 首先导入jar包 struts2的json-lib，struts2-json-plugin包 我用的是maven，pom.xml是这样配置的： <!-- struts2依赖包 --> <dependency> <groupId>org.apache.struts</groupId> <
React如何从后端获取数据并渲染到前端？
uwenhao2008的博客
03-14 3万+
React.js 自己的定位是“A JavaScript Library for building user interface”，它的文档称许多人将它用作 MVC 的 V。因此，React.js 不关心你是如何嵌入后端数据的。换句话说，我们怎么使用一个标准的 HTML 元素和后端打交道，就可以把同样的思路运用在 React.js 创造的组件上。比如，一个 input，可以：&lt;input i...
jsp页面使用el 按key获取map中的对应值GOOD
热门推荐
Baple的专栏
01-19 6万+
action中的代码 private Map msgs = new HashMap msgs.put("loginError", "验证码错误"); jsp页面中的代码：     var msgTip = "${msgs['loginError']}";     alert(msgTip); 注意事项：map名后不要加点，直接是[]           key
Struts2+JSON 实现AJAX 返回对象和列表
Polaris
07-15 4431
JSON 是一个插件,它允许我们在JavaScript中异步调用Action,它提供了一个json的返回结果类型(ResultType),只要为Action指定类型为 json返回结果类型,那么这个响应结果不需要返回给任何视图层,JSON会将Action里的状态信息序列化为JSON指定格式的数据,并将该数据返回 给JAVASCRIPT,这样可以完成AJAX的应用交互. 要应用 JSO
基于Struts2+Hibernate5框架实现一个教师信息管理系统。
最新发布
05-17
好的，下面是一个简单的教师信息管理系统的实现思路，供参考： 1. 确定数据库表结构设计：创建教师表，包括教师ID、姓名、性别、出生日期、所属学院等字段。 2. 搭建Struts2+Hibernate5框架：在eclipse中新建Web项目，添加相关jar包，配置struts.xml和hibernate.cfg.xml文件。 3. 编写实体类：创建Teacher类，与教师表对应，使用Hibernate注解映射字段。 4. 编写DAO层：使用Hibernate提供的API实现对教师信息的增删改查操作。 5. 编写Action类：实现对教师信息的增删改查请求的处理，包括获取请求参数、调用DAO层方法、设置返回结果等。 6. 编写JSP页面：实现用户与系统交互的界面，包括教师信息列表、添加教师信息、修改教师信息、删除教师信息等操作。 7. 部署运行：将项目打包成war包，部署到Tomcat服务器上运行。 以上是一个简单的教师信息管理系统的实现思路，具体实现过程需要根据具体情况进行调整。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值