今天在学习struts2标签s:optiontransferselect的时候遇到一个问题,就是从新排序后的数据回传到action或后台的的问题,找了一个晚自习终于对这个很多程序猿眼中的bug解决了一点点,直接使用这个标签后运行时火狐的firebug会报错
- <s:form action="orderBack" method="post">
- <s:optiontransferselect
- leftTitle="未排序试题" name="leftList" list="list"
- listKey="id" listValue="name" headerKey="cnKey"
- cssStyle="width:100px;height:200px"
- label="试题排序"
- addToLeftLabel="向左移动" addToRightLabel="向右移动"
- addAllToRightLabel="全部导入右侧" addAllToLeftLabel="全部导入左侧"
- selectAllLabel="选中所有" id="leftListId"
- leftUpLabel="上移" leftDownLabel="下移"
- rightTitle="已排序试题"
- doubleList="orderList" doubleListKey="id" doubleListValue="name"
- doubleName="rightList" doubleHeaderKey="cnKey" doubleMultiple="true"
- doubleId="rightListId"
- rightUpLabel="上移" rightDownLabel="下移"
- doubleCssStyle="width:100px;height:200px" >
- </s:optiontransferselect>
- <s:submit value="排序完成" />
- </s:form>
<s:form action="orderBack" method="post">
<s:optiontransferselect
leftTitle="未排序试题" name="leftList" list="list"
listKey="id" listValue="name" headerKey="cnKey"
cssStyle="width:100px;height:200px"
label="试题排序"
addToLeftLabel="向左移动" addToRightLabel="向右移动"
addAllToRightLabel="全部导入右侧" addAllToLeftLabel="全部导入左侧"
selectAllLabel="选中所有" id="leftListId"
leftUpLabel="上移" leftDownLabel="下移"
rightTitle="已排序试题"
doubleList="orderList" doubleListKey="id" doubleListValue="name"
doubleName="rightList" doubleHeaderKey="cnKey" doubleMultiple="true"
doubleId="rightListId"
rightUpLabel="上移" rightDownLabel="下移"
doubleCssStyle="width:100px;height:200px" >
</s:optiontransferselect>
<s:submit value="排序完成" />
</s:form>
通过进入struts2内部的处理机制分析,是在加载util.js的时候出现的问题
解决办法就是将其解压出来从外部链接到页面,但是这里只用到了submit的提交的事件注册,所以
只用将以下代码引入就可以解决这个bug
- <script type="text/javascript">
- var StrutsUtils = {};
- StrutsUtils.addEventListener = function(element, name, observer, capture) {
- if (element.addEventListener) {
- element.addEventListener(name, observer, false);
- } else if (element.attachEvent) {
- element.attachEvent('on' + name, observer);
- }
- };
- </script>
<script type="text/javascript">
var StrutsUtils = {};
StrutsUtils.addEventListener = function(element, name, observer, capture) {
if (element.addEventListener) {
element.addEventListener(name, observer, false);
} else if (element.attachEvent) {
element.attachEvent('on' + name, observer);
}
};
</script>
这么说可能有点抽象,下面是我写的一个小事例希望能够帮助大家
index,jsp
- <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
- <%
- String path = request.getContextPath();
- String basePath = request.getScheme() + "://"
- + request.getServerName() + ":" + request.getServerPort()
- + path + "/";
- %>
- <%@taglib prefix="s" uri="/struts-tags"%>
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
- <html>
- <head>
- <title>所有试题</title>
- </head>
- <body>
- <table border="1" width="300px">
- <tr>
- <td>顺序</td>
- <td>试题名称</td>
- </tr>
- <s:iterator value="list">
- <tr>
- <td>题号:<s:property value="id" /></td>
- <td>试题:<s:property value="name" /></td>
- </tr>
- </s:iterator>
- </table>
- <s:a href="order">试题排序</s:a>
- <s:debug />
- </body>
- </html>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>所有试题</title>
</head>
<body>
<table border="1" width="300px">
<tr>
<td>顺序</td>
<td>试题名称</td>
</tr>
<s:iterator value="list">
<tr>
<td>题号:<s:property value="id" /></td>
<td>试题:<s:property value="name" /></td>
</tr>
</s:iterator>
</table>
<s:a href="order">试题排序</s:a>
<s:debug />
</body>
</html>
struts2.xml
- <?xml version="1.0" encoding="UTF-8" ?>
- <!DOCTYPE struts PUBLIC
- "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
- "http://struts.apache.org/dtds/struts-2.3.dtd">
- <struts>
- <package name="exam" namespace="/" extends="struts-default">
- <action name="findAll" class="action.QuestionAction" method="findAll">
- <result name="success">/index.jsp</result>
- </action>
- <action name="order" class="action.QuestionAction" method="order">
- <result name="success">/order.jsp</result>
- </action>
- <action name="orderBack" class="action.QuestionAction" method="orderBack">
- <result name="success">/list.jsp</result>
- </action>
- </package>
- <!-- Add packages here -->
- </struts>
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
"http://struts.apache.org/dtds/struts-2.3.dtd">
<struts>
<package name="exam" namespace="/" extends="struts-default">
<action name="findAll" class="action.QuestionAction" method="findAll">
<result name="success">/index.jsp</result>
</action>
<action name="order" class="action.QuestionAction" method="order">
<result name="success">/order.jsp</result>
</action>
<action name="orderBack" class="action.QuestionAction" method="orderBack">
<result name="success">/list.jsp</result>
</action>
</package>
<!-- Add packages here -->
</struts>
model类
- package model;
- public class Question {
- private int id;
- private int order;
- private String name;
- public Question(int id, int order, String name) {
- this.id = id;
- this.order = order;
- this.name = name;
- }
- public int getId() {
- return id;
- }
- public void setId(int id) {
- this.id = id;
- }
- public int getOrder() {
- return order;
- }
- public void setOrder(int order) {
- this.order = order;
- }
- public String getName() {
- return name;
- }
- public void setName(String name) {
- this.name = name;
- }
- }
package model;
public class Question {
private int id;
private int order;
private String name;
public Question(int id, int order, String name) {
this.id = id;
this.order = order;
this.name = name;
}
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public int getOrder() {
return order;
}
public void setOrder(int order) {
this.order = order;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
action类
- package action;
- import java.util.ArrayList;
- import java.util.List;
- import model.Question;
- import com.opensymphony.xwork2.ActionSupport;
- public class QuestionAction extends ActionSupport {
- /**
- *
- */
- private static final long serialVersionUID = 1L;
- // 未排序的数组
- private List<Question> list = new ArrayList<Question>();
- // 已排序试题
- private List<Question> orderList = new ArrayList<Question>();
- // 排序后的数组,由于之前的页面提交后会在parameters域中存入
- // parameters
- // {__multiselect_rightList=[Ljava.lang.String;@1206cda0,
- // __multiselect_leftList=[Ljava.lang.String;@7ca5cc9e,
- // rightList=[Ljava.lang.String;@691cd900}
- // 其中的rightList就是s:optiontransferselect中设置的doubleName的值
- // 这个数据会跟随提交自动的传入到action类中的同名函数进行赋值
- //会得到一个右边的列表排序后的id的数组
- //普通的数据类型会自动转换类型将String转换为Integer
- private Integer[] rightList;
- private List<Question> getAll() {
- List<Question> list = new ArrayList<Question>();
- Question q1 = new Question(1, 0, "试题1");
- Question q2 = new Question(2, 0, "试题2");
- Question q3 = new Question(3, 0, "试题3");
- Question q4 = new Question(4, 0, "试题4");
- list.add(q1);
- list.add(q2);
- list.add(q3);
- list.add(q4);
- return list;
- }
- // 模拟数据库
- public String findAll() {
- list = getAll();
- return SUCCESS;
- }
- // 传递数据
- public String order() {
- list = getAll();
- return SUCCESS;
- }
- public List<Question> getList() {
- return list;
- }
- public void setList(List<Question> list) {
- this.list = list;
- }
- public List<Question> getOrderList() {
- return orderList;
- }
- public void setOrderList(List<Question> orderList) {
- this.orderList = orderList;
- }
- //获取前台传入的排序后的列表的ID列表
- public Integer[] getRightList() {
- return rightList;
- }
- public void setRightList(Integer[] rightList) {
- this.rightList = rightList;
- }
- public String orderBack() {
- //直接获取原始的数据
- list = getAll();
- //遍历
- for (int i = 0; i < rightList.length; i++) {
- //通过遍历
- //从原始数据中查询数据,按照排序后的id的查询
- //如果是Map的时候直接根据key进行查询
- //rightList[i]------------获取的是排序后数组中的一个id数据,
- //由于试题的原始数据是顺序的所以通过试题id-1可以得到当前的试题的所在的位置下标
- //list.get(index);--------获取指定下标的集合中的元素
- //orderList.add();-------向排序后的集合加入数据
- //从而得到排序后的集合
- orderList.add(list.get(rightList[i] - 1));
- }
- return SUCCESS;
- }
- }
package action;
import java.util.ArrayList;
import java.util.List;
import model.Question;
import com.opensymphony.xwork2.ActionSupport;
public class QuestionAction extends ActionSupport {
/**
*
*/
private static final long serialVersionUID = 1L;
// 未排序的数组
private List<Question> list = new ArrayList<Question>();
// 已排序试题
private List<Question> orderList = new ArrayList<Question>();
// 排序后的数组,由于之前的页面提交后会在parameters域中存入
// parameters
// {__multiselect_rightList=[Ljava.lang.String;@1206cda0,
// __multiselect_leftList=[Ljava.lang.String;@7ca5cc9e,
// rightList=[Ljava.lang.String;@691cd900}
// 其中的rightList就是s:optiontransferselect中设置的doubleName的值
// 这个数据会跟随提交自动的传入到action类中的同名函数进行赋值
//会得到一个右边的列表排序后的id的数组
//普通的数据类型会自动转换类型将String转换为Integer
private Integer[] rightList;
private List<Question> getAll() {
List<Question> list = new ArrayList<Question>();
Question q1 = new Question(1, 0, "试题1");
Question q2 = new Question(2, 0, "试题2");
Question q3 = new Question(3, 0, "试题3");
Question q4 = new Question(4, 0, "试题4");
list.add(q1);
list.add(q2);
list.add(q3);
list.add(q4);
return list;
}
// 模拟数据库
public String findAll() {
list = getAll();
return SUCCESS;
}
// 传递数据
public String order() {
list = getAll();
return SUCCESS;
}
public List<Question> getList() {
return list;
}
public void setList(List<Question> list) {
this.list = list;
}
public List<Question> getOrderList() {
return orderList;
}
public void setOrderList(List<Question> orderList) {
this.orderList = orderList;
}
//获取前台传入的排序后的列表的ID列表
public Integer[] getRightList() {
return rightList;
}
public void setRightList(Integer[] rightList) {
this.rightList = rightList;
}
public String orderBack() {
//直接获取原始的数据
list = getAll();
//遍历
for (int i = 0; i < rightList.length; i++) {
//通过遍历
//从原始数据中查询数据,按照排序后的id的查询
//如果是Map的时候直接根据key进行查询
//rightList[i]------------获取的是排序后数组中的一个id数据,
//由于试题的原始数据是顺序的所以通过试题id-1可以得到当前的试题的所在的位置下标
//list.get(index);--------获取指定下标的集合中的元素
//orderList.add();-------向排序后的集合加入数据
//从而得到排序后的集合
orderList.add(list.get(rightList[i] - 1));
}
return SUCCESS;
}
}
order.jsp
- <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
- <%
- String path = request.getContextPath();
- String basePath = request.getScheme() + "://"
- + request.getServerName() + ":" + request.getServerPort()
- + path + "/";
- %>
- <%@taglib prefix="s" uri="/struts-tags"%>
- <%@taglib prefix="sx" uri="/struts-dojo-tags"%>
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
- <html>
- <head>
- <title>排列试题</title>
- <!-- 由于struts2的内部的bug必须进行手动加载util.js文件 -->
- <!-- 这里只用到了StrutsUtils所以只用手动加载一下代码就可以直接用submit控件,将数据提交的后台, -->
- <!-- 提交后的数据目前我只找到了doubleName指定名称的集合是重新排列 doubleListKey后的一个数组,
- 这个数组可以在后台通过同名函数获取-->
- <script type="text/javascript">
- var StrutsUtils = {};
- StrutsUtils.addEventListener = function(element, name, observer, capture) {
- if (element.addEventListener) {
- element.addEventListener(name, observer, false);
- } else if (element.attachEvent) {
- element.attachEvent('on' + name, observer);
- }
- };
- </script>
- </head>
- <body>
- <s:form action="orderBack" method="post">
- <s:optiontransferselect
- leftTitle="未排序试题" name="leftList" list="list"
- listKey="id" listValue="name" headerKey="cnKey"
- cssStyle="width:100px;height:200px"
- label="试题排序"
- addToLeftLabel="向左移动" addToRightLabel="向右移动"
- addAllToRightLabel="全部导入右侧" addAllToLeftLabel="全部导入左侧"
- selectAllLabel="选中所有" id="leftListId"
- leftUpLabel="上移" leftDownLabel="下移"
- rightTitle="已排序试题"
- doubleList="orderList" doubleListKey="id" doubleListValue="name"
- doubleName="rightList" doubleHeaderKey="cnKey" doubleMultiple="true"
- doubleId="rightListId"
- rightUpLabel="上移" rightDownLabel="下移"
- doubleCssStyle="width:100px;height:200px" >
- </s:optiontransferselect>
- <s:submit value="排序完成" />
- </s:form>
- <s:debug />
- </body>
- </html>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@taglib prefix="sx" uri="/struts-dojo-tags"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>排列试题</title>
<!-- 由于struts2的内部的bug必须进行手动加载util.js文件 -->
<!-- 这里只用到了StrutsUtils所以只用手动加载一下代码就可以直接用submit控件,将数据提交的后台, -->
<!-- 提交后的数据目前我只找到了doubleName指定名称的集合是重新排列 doubleListKey后的一个数组,
这个数组可以在后台通过同名函数获取-->
<script type="text/javascript">
var StrutsUtils = {};
StrutsUtils.addEventListener = function(element, name, observer, capture) {
if (element.addEventListener) {
element.addEventListener(name, observer, false);
} else if (element.attachEvent) {
element.attachEvent('on' + name, observer);
}
};
</script>
</head>
<body>
<s:form action="orderBack" method="post">
<s:optiontransferselect
leftTitle="未排序试题" name="leftList" list="list"
listKey="id" listValue="name" headerKey="cnKey"
cssStyle="width:100px;height:200px"
label="试题排序"
addToLeftLabel="向左移动" addToRightLabel="向右移动"
addAllToRightLabel="全部导入右侧" addAllToLeftLabel="全部导入左侧"
selectAllLabel="选中所有" id="leftListId"
leftUpLabel="上移" leftDownLabel="下移"
rightTitle="已排序试题"
doubleList="orderList" doubleListKey="id" doubleListValue="name"
doubleName="rightList" doubleHeaderKey="cnKey" doubleMultiple="true"
doubleId="rightListId"
rightUpLabel="上移" rightDownLabel="下移"
doubleCssStyle="width:100px;height:200px" >
</s:optiontransferselect>
<s:submit value="排序完成" />
</s:form>
<s:debug />
</body>
</html>
list.jsp
- <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
- <%
- String path = request.getContextPath();
- String basePath = request.getScheme() + "://"
- + request.getServerName() + ":" + request.getServerPort()
- + path + "/";
- %>
- <%@taglib prefix="s" uri="/struts-tags"%>
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
- <html>
- <head>
- <title>所有试题</title>
- </head>
- <body>
- <table border="1" width="300px">
- <tr>
- <td>顺序</td>
- <td>试题名称</td>
- </tr>
- <s:iterator value="orderList">
- <tr>
- <td>题号:<s:property value="id" /></td>
- <td>试题:<s:property value="name" /></td>
- </tr>
- </s:iterator>
- </table>
- <s:a href="order">试题排序</s:a>
- <s:property value="#com.opensymphony.xwork2.ActionContext.parameters['leftList']"/>
- <s:debug />
- </body>
- </html>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>所有试题</title>
</head>
<body>
<table border="1" width="300px">
<tr>
<td>顺序</td>
<td>试题名称</td>
</tr>
<s:iterator value="orderList">
<tr>
<td>题号:<s:property value="id" /></td>
<td>试题:<s:property value="name" /></td>
</tr>
</s:iterator>
</table>
<s:a href="order">试题排序</s:a>
<s:property value="#com.opensymphony.xwork2.ActionContext.parameters['leftList']"/>
<s:debug />
</body>
</html>
web.xml配置文件
- <?xml version="1.0" encoding="UTF-8"?>
- <web-app id="WebApp_9" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
- <display-name>Struts Blank</display-name>
- <filter>
- <filter-name>struts2</filter-name>
- <filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
- </filter>
- <filter-mapping>
- <filter-name>struts2</filter-name>
- <url-pattern>/*</url-pattern>
- </filter-mapping>
- <welcome-file-list>
- <welcome-file>index.jsp</welcome-file>
- </welcome-file-list>
- </web-app>