老是被前端与后台之间的传值给弄糊涂了，特此写一篇blog进行总结。
一. 前端向后台传值
（1）属性驱动
属性驱动是指在Action类里，包含表单里对应的字段（字段名称一样），同时设置对应的getter和setter。
表单代码：html
1: <form action="login" method="post">
2: <label>username:</label>
3: <input type="text" name="username">
4: <label>password:</label>
5: <input type="text" name="username">
6: </form>
对应的Action：LoginAction
java代码：
1: public LoginAction extends ActionSupport{
2: private String username; //对应表单中input属性name=username
3: private String password; //对应表单中input属性name=password
4:
5: /*-- getter and setter --*/
6: public void setUsername(String username){
7: this.username = username;
8: }
9: public String getUsername(){
10: return this.username;
11: }
12: public void setPassword(String password){
13: this.password = password;
14: }
15: public String getPassword(){
16: return this.password;
17: }
18: public String execute(){
19: return SUCCESS;
20: }
21: }
在struts.xml中配置Action
1: <action name="login" class="com.bigdata.action.LoginAction">
2: <result name="success">success.jsp</result>
3: </action>
在success.jsp页面中使用{username}来访问username属性。
属性驱动适合于表单域传值较少的情况，如果表单域过多的话，Java代码将会充斥着大量的getter和setter代码。
（2）对象驱动
对象驱动是指在Action里包含一个对象，而这个对象的属性与表单域一一对应。
对应的Action：LoginAction
1: public LoginAction extends ActionSupport{
2: private User user;
3:
4: /*-- getter and setter --*/
5: public void setUser(User user){
6: this.user = user;
7: }
8: public User getUser(){
9: return this.user;
10: }
11: public String execute(){
12: return SUCCESS;
13: }
14: }
对应的user类：
1: public Class User{
2: private String username;
3: private String password;
4:
5: public String getPassword() {
6: return password;
7: }
8: public void setPassword(String password) {
9: this.password = password;
10: }
11:
12: public String getUsername(){
13: return username;
14: }
15: public void setUsername(String username){
16: this.username = username;
17: }
18: }
前台html页面代码
1: <form action="login" method="post">
2: <label>username:</label>
3: <input type="text" name="user.username">
4: <label>password:</label>
5: <input type="text" name="user.password">
6: </form>
表单域的name由对象名和属性名组成，中间用.连接，Action对象被创建后，通过setter进行赋值。Action result页面则通过${user.username}来访问。
二. 后台向前端传值
（1）使用Struts2的标签
对应Action：
1: public Class CollectAction extends ActionSupport{
2: private String [] arryStr;
3: //遍历list
4: private List<User> list;
5: private Map<String,String> map;
6: private Map<Integer,User> userMap;
7: private Map<String,List<User>> userListMap;
8:
9: public void setArryStr(String[] arryStr){
10: this.arryStr = arryStr;
11: }
12: public String[] getArryStr(){
13: return arryStr;
14: }
15:
16: //省略其他的getter与setter
17: public String execute(){
18:
19: arryStr[] = new String[]{"wbl","sdfsdf","gfg"};
20:
21: list.add(new User("wbl","123"));
22: list.add(new User("avd","ggg"));
23: list.add(new User("eee","iii"));
24:
25: map.put("key1","value1");
26: map.put("key2","value2");
27: map.put("key3","value3");
28:
29: userMap.put(1,new User("wbl","123"));
30: userMap.put(2,new User("avd","ggg"));
31:
32: userListMap.put("user",list);
33: }
34: }
Action对应的JSP页面：
1: <div id="arryStr">
2: <!-- iterator遍历String 字符数组 -->
3: <s:iterator value="arryStr" id="arryValue">
4: <span><s:property value="arryValue" /></span>
5: </s:iterator>
6: </div>
7:
8: <div id="list">
9: <!-- iterator遍历List集合 -->
10: <table>
11: <s:iterator value="list" id="user">
12: <tr>
13: <td><s:property value="username" /></td>
14: <td><s:property value="password" /></td>
15: </tr>
16: </s:iterator>
17: </table>
18: </div>
19:
20: <div id="map">
21: <!-- iterator遍历Map中的String字符串 -->
22: <s:iterator value="map" id="column">
23: <tr>
24: <td>Key:<s:property value="key" /></td>
25: <td>Value:<s:property value="value" /></td>
26: </tr>
27: </s:iterator>
28: </div>
29:
30: <div id="userMap">
31: <!-- iterator遍历Map中的User 对象(Object) -->
32: <s:iterator value="userMap" id="column">
33: <tr>
34: <td><s:property value="value.username"/></td>
35: <td><s:property value="value.password"/></td>
36: </tr>
37: </s:iterator>
38: </div>
39:
40: <div id="userlistMap">
41: <!-- iterator遍历Map中的List集合 -->
42: <s:iterator value="userListMap" id="column">
43: <s:set var="total" name="total" value="#column.value.size"/>
44: <s:iterator value="#column.value" id="col" status="st">
45: <tr>
46: <td><s:property value="username"/></td>
47: <td><s:property value="password"/></td>
48: </tr>
49: </s:iterator>
50: </s:iterator>
51: </div>
（2）AJAX
ajax方式可以实现异步更新数据，这里我采用json格式传输数据。
首先，建立一个action：
1: public class ajaxAction extends ActionSupport{
2: private JSONObject dataObj; //向前台传递的JSON数据
3:
4: public JSONObject getDataObj() {
5: return dataObj;
6: }
7:
8: public void setDataObj(JSONObject dataObj) {
9: this.dataObj = dataObj;
10: }
11:
12: public String execute(){
13: dataObj = new JSONObject();
14: dataObj.put("key","value");
15: dataObj.put("result","SUCCESS");
16: return SUCCESS;
17: }
18: }
struts.xml中action的配置
1: <action name="ajax" class="com.bigdata.action.ajaxAction">
2: <result type="json">
3: <param name="root">dataObj</param>
4: <param name="callbackParameter">jsoncallback</param>
5: </result>
6: </action>
如果为某个action指定了一个类型为json的Result，则该Result无须映射到任何视图资源，因为json插件会负责将Action里的状态信息序列化成JSON格式的字符串，并将该字符串返回给客户端浏览器。
json类型的Result允许指定的参数
root：设置该参数将不再把整个Action对象序列化成JSON字符串，而只是将该参数所指定的Action的属性序列化成JSON字符串返给客户端，本例中将会把dataObj进行序列化。
callbackParameter: 配置该参数之后，才能进行JSON的跨域传输。
前端利用jQuery完成AJAX交互
1: <div id="ajaxTest">
2: <input type="button" value="test" id="show">
3: </div>
4: </body>
5: <script type="text/javascript" src="js/jquery.js"></script>1:2: <script>3: $(function(){4: $("show").click(function(){5: $.getJSON(6: /*访问Action的URL地址*/7: "http://localhost:8080/bigData/ajax?jsoncallback=?",8: /*得到服务器响应之后的操作*/9: function(respose){10: if(respose.result == "SUCCESS")11: $("#ajaxTest").append("<span>SUCCESS</span>");12: })13: })14: })</script>
6: </html>
function中的参数response对应Action中的dataObj，此时就可以获得由后端传入的值。
时间： 2024-11-07 16:49:22