Struts 2 的标签库（四）

 

六、 表单标签

表单标签，分为 2 种 ： form 标签本身和单个表单元素的标签。

 

6.1 表单标签的通用属性

  所有表单标签处理类都继承了 UIBean 类， UIBean 包含了一些通用属性，这些通用属性分 3 种：

　●　模版相关属性

　●　 JavaScript 相关属性

　●　通用属性

 

${parameters.form.id} 来取得表单元素所在表单的 ID

 

模版相关属性如下：

　●　templateDir ： 指定该表单所用的模版文件目录

　●　theme ： 指定该表单所用的主题。

　●　template ： 指定该表单所用的模版

 

JavaScript 相关的通用属性如下：

　●　onclick ： 指定鼠标在该标签生成的表单元素上单击时触发 的 JavaScript 函数

　●　ondbclick ： 指定鼠标 在该标签上双击时触发 的 JavaScript 函数

　●　onmousedown ： 指定鼠标 在该标签上按下时触发 的 JavaScript 函数

　●　onmouseup ： 指定鼠标 在该标签上松开时触发 的 JavaScript 函数

　●　onmouseover ： 指定鼠标 在该标签上悬停时触发 的 JavaScript 函数

　●　onmouseout ： 指定鼠标 移出该标签时触发 的 JavaScript 函数

　●　onfocus ： 指定该标签得到焦点时触发 的函数

　●　onblur ： 指定该标签失去焦点时触发 的函数

　●　onkeypress ： 指定单击键盘上某个键时触发 的函数

　●　onkeyup ： 指定松开键盘上某个键时触发 的函数

　●　onkeydown ： 指定按下键盘上某个键时触发 的函数

　●　onselect ： 对下拉列表项等可以选择表单元素 ，指定选中该元素时触发的函数

　●　onchange ： 对于文本框等可以接受输入的表单元素 ，指定当值改变时触发的函数

Struts 2 还允许为表单元素设置提示，当鼠标在这些元素上悬停时，系统将出现提示， Struts 2 将这种特性称为 Tooltip 。

与 Tooltip 相关的通用属性如下 ：

　●　tooltip ： 设置次组件的 Tooltip

　●　tooltipIcon ： 设置 Tooltip 图标的 URL 路径

　●　tooltipAboveMousePointer ： 是否在光标位置上显示 Tooltip。也可通过设置 tooltipOffse Y 属性，设置 Tooltip 与光标位置的垂直移位

　●　tooltipBgColor ： 设置 Tooltip 的背景色

　●　tooltipBgImg ： 设置 Tooltip 的背景图片

　●　tooltipBorderWidth ： 设置 Tooltip 边框的宽度

　●　tooltipBorderColor ： 设置 Tooltip 边框的颜色

　●　tooltipDelay ： 设置显示 Tooltip 的时间延迟（单位是毫秒）

　●　tooltipFixCoordinateX ： 设置固定 Tooltip 在指定的 X 坐标上，与 tooltipSticky 属性结合时很有用

　●　tooltipFixCoordinateY ： 设置固定 Tooltip 在指定的 Y 坐标上，与 tooltipSticky 属性结合时很有用

　●　tooltipFontColor ： 设置 Tooltip 的字体颜色

　●　tooltipFontFace ： 设置 Tooltip 的字体，如： verdana、geneva、sans-serif

　●　tooltipFontSize ： 设置 Tooltip 的字体大小，如： 30px

　●　tooltipFontWeight ： 设置 Tooltip 的字体是否使用粗体，可以接受 normal 和 bold 两个值

　●　tooltipLeftOfMousePointer ： 设置是否在光标左侧显示 Tooltip ，默认是右边显示

　●　tooltipOffsetX ： 设置 Tooltip 相对光标位置的水平位移

　●　tooltipOffsetY ： 设置 Tooltip 相对光标位置的垂直位移

　●　tooltipOpacity ： 设置 Tooltip 的透明度，设置可以是 0 （完全透明） 和 100 （不透明） 之间的数字。 Opera 浏览器不支持

　●　tooltipPadding ： 指定 Tooltip 的内部间隔。如： 边框和内容之间的间距

　●　tooltipShadowColor ： 使用指定颜色为 Tooltip 创建阴影

　●　tooltipShadowWidth ： 使用指定的宽度为 Tooltip 创建阴影

　●　tooltipStatic ：设置 Tooltip 是否随着光标的移动而移动

　●　tooltipSticky ： 设置 Tooltip 是否一直停留在它初始位置，直到另外一个 Tooltip 被激活，或者浏览者点击了 HTML 页面

　●　tooltipStayAppearTime ： 指定一个 Tooltip 消失的时间间隔（毫秒）

　●　tooltipTextAlign ：设置 Tooltip 的标题和内容的对齐方式，可以是 right、left、justify

　●　tooltipTitle ： 设置 Tooltip 的标题文字

　●　tooltipTitleColor ： 设置 Tooltip 的标题文字的颜色

　●　tooltipWidth ： 设置 Tooltip 的宽度

 

设置表单元素的 CSS 式样等：

　●　cssClass ： 设置 class 属性

　●　cssStyle ： 设置 style 属性，使用内联的 CSS 样式

　●　title ： 设置表单元素 title 属性

　●　disabled ： 设置表单元素的 disabled 属性

　●　label ：设置表单元素的 label 属性

　●　labelPosition ： 设置表单元素 label 所在位置，可接受 top，left 。默认左边

　●　requiredposition ： 定义必填标记 （默认 * ) 位于 label 元素的位置，可接受 left、right，默认右边

　●　name ： 定义表单元素的 name 属性，该属性值用于与 Action 的属性形成对应

　●  required ： 定义是否在表单元素的 label 上增加必填标记（默认 *） 设置为 true 时增加必填标记，否则不增加　

　●　tabIndex ： 设置表单元素的 tabindex 属性

　●　value ： 设置表单元素的 value 属性

　

6.2 表单标签的 name 和 value 属性

  name 和 value 属性之间存在一个独特的关系 ： 因为每个表单元素会被映射成 Action 属性，所以如果某个表单对应的 Action 已经被实例化、且其属性有值时，则该 Action 对应表单里的表单元素会显示出该属性的值，这个值将作为表单标签的 value 值

  name 属性设置表单元素的名字，表单元素的名字实际上封装着一个请求参数，而请求参数是被封装到 Action 属性的。因此，可以将该 name 属性指定为你希望绑定值的表达式。

  也就是说，表单标签的 name 属性值可使用表达式，如下：

<s:textfield name ="person.firstName" />

 希望表单元素里可以显示出对应 Action 的属性值：

<s:textfield name ="person.firstName" value="${person.firstName}" />

 事实上， Struts 2 的标签库，无需指定 value 属性，因为 Struts 2 会为我们处理：

<s:textfield name ="person.firstName" />

虽然上面文本框没有指定 value 属性，但 Struts 2 一样会在该文本框中输出对应的 Action 里的 person 属性的 firstName 属性值

Struts 2 提供了很多表单标签，大部分表单标签和 HTML 表单元素之间有一一对应的关系，所以不再陈述。下面介绍一些比较特殊的表单标签

 

6.3 checkboxlist 标签

　 checkboxlist 标签可以一次创建多个复选框，用于同时生成多个 <input type="checkbox" ../> 。

  常用属性：

  ●　listKey ： 该属性指定集合元素中的某个属性（例如集合元素为 Person 实例，指定 Person 实例的 name 属性 ）作为复选框的 value 。如果集合是 map ，则可以使用 key 和 value 值指定 Map 对象的 key 和 value 作为复选框的标签。

　●　listValue ： 该属性指定集合元素中的某个属性（例如集合元素为 Person 实例，指定 Person 实例的 name 属性） 作为复选框的标签。如果集合是 map，则可以使用 key 和 value 值指定 Map 对象的 key 和 value 作为复选框的标签

 

 

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
	<display-name>struts2</display-name>
	<welcome-file-list> 
	  <welcome-file>index.jsp</welcome-file>
	</welcome-file-list>  
    <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>
</web-app>

struts.xml

<?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.2.dtd">

<struts>
	<constant name="struts.custom.i18n.resources"
		value="messageResource"/>
	<constant name="struts.i18n.encoding" value="GBK"/>
	
	<package name="js"  extends="struts-default" namespace="/09">		
		
		<action name="checkboxlistAction" class="js.CheckboxlistAction">
			<result name="success">/09/s-checkboxlist.jsp</result>  
		</action>		
		<action name="">
			<result>.</result>
		</action>
	</package>
	
</struts>

 s-checkboxlist.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
	<title>使用s:checkboxlist生成多个复选框</title>
	
<s:head/>
</head>
<body>

<s:form action="checkboxlistAction.action" method="post">
<h3>使用s:checkboxlist生成多个复选框</h3>

	<table>
		<tr>
			<td>111</td>
			<td><!-- 使用简单集合来生成多个复选框 --> <s:checkboxlist name="a"
				label="请选择您喜欢的图书" labelposition="top"
				list="{'Struts 2权威指南' ,	'轻量级Java EE企业应用实战' , '疯狂Ajax讲义'}" /></td>
		</tr>
		<tr>
			<td>222</td>
			<td><!-- 使用简单Map对象来生成多个复选框 ,使用Map对象的key（书名）作为复选框的value，使用Map对象的value（出版时间）作为复选框的标签-->
			<s:checkboxlist name="b" label="请选择您想选择出版日期" labelposition="top"
				list="#{'Struts 2权威指南':'2007年10月',	'轻量级Java EE企业应用实战':'2007月4月',
	'疯狂Ajax讲义':'2007年6月'}"
				listKey="key" listValue="value" />
			</td>
		</tr>
		<tr>
			<td>333</td>
			<td>
				<!-- 创建一个JavaBean对象，并将其放入Stack Context中 -->
				<s:bean name="js.BookService" id="bs"/>
				<!-- 使用集合里放多个JavaBean实例来生成多个复选框
					使用集合元素里name属性作为复选框的标签
					使用集合元素里author属性作为复选框的value-->
				<s:checkboxlist name="c" label="请选择您喜欢的图书" 	labelposition="top"	list="#bs.books" listKey="author" 	listValue="name"/>
			</td>
		</tr>
		<tr>
			<td>444</td>
			<td>
				<s:checkboxlist name="aList1"   list="#request.aList"  labelposition="top"></s:checkboxlist>
				<s:submit label="sumbit"></s:submit>
			</td>
		</tr>
	</table>
</s:form>
</body>
</html>

CheckboxlistAction

package js;

import java.util.ArrayList;
import java.util.List;

import javax.servlet.http.HttpServletRequest;

import org.apache.struts2.ServletActionContext;

import com.opensymphony.xwork2.ActionSupport;

public class CheckboxlistAction extends ActionSupport {

    private List<String> a;
    private List<String> b;
    private List<String> c;    
    private List<String> aList;
    private String[] strs;

    @Override
    public String execute() throws Exception {
     
        if (a != null && !a.isEmpty()) {
            System.out.println("a : " + a.toString());
        }else{
            System.out.println("a is null! ");
        }
        if (b != null && !b.isEmpty()) {
            System.out.println("b : " + b.toString());
        }else{
            System.out.println("b is null! ");
        }
        if (c != null && !c.isEmpty()) {
            System.out.println("c : " + c.toString());
        }else{
            System.out.println("c is null! ");
        }
        if (strs != null ) {
            System.out.println("strs : " + strs.toString());
        }else{
            System.out.println("strs is null! ");
        }
        if (aList != null && !aList.isEmpty()) {
            System.out.println("aList : " + aList.toString());
        }else{
            System.out.println("aList is null! ");
            aList = new ArrayList<String>();
            aList.add("a");
            aList.add("b");
            aList.add("c");
            HttpServletRequest request = ServletActionContext.getRequest();  
            request .setAttribute("aList", aList);
        }
            
        return SUCCESS;
    }

    public List<String> getA() {
        return a;
    }

    public void setA(List<String> a) {
        this.a = a;
    }

    public List<String> getB() {
        return b;
    }

    public void setB(List<String> b) {
        this.b = b;
    }

    public List<String> getC() {
        return c;
    }

    public void setC(List<String> c) {
        this.c = c;
    }

    public List<String> getaList() {
        return aList;
    }

    public void setaList(List<String> aList) {
        this.aList = aList;
    }

  

    public String[] getStrs() {
        return strs;
    }

    public void setStrs(String[] strs) {
        this.strs = strs;
    }

    
}

 BookService

package js;

public class BookService {
    public Book[] getBooks() {
        return new Book[]{
            new Book("疯狂Java讲义","李刚"),
            new Book("Struts 2权威指南","李刚"),
            new Book("轻量级Java EE企业应用实战","李刚"),
            new Book("疯狂Ajax讲义","李刚")
        };
    }
}

 Book

package js;

public class Book {

    private String name;

    private String author;

    public Book() {
    }

    public Book(String name, String author) {
        this.name = name;
        this.author = author;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getName() {
        return this.name;
    }

    public void setAuthor(String author) {
        this.author = author;
    }

    public String getAuthor() {
        return this.author;
    }

}

 

<s:a href="" onclick="newWin('09/checkboxlistAction.action');" cssStyle="cursor: hand;">s-checkboxlist.jsp</s:a>

 

 

通过指定 listKey 和 listValue 属性，可以灵活地控制这系列复选框的 value 和 标签

listKey= value

listValue= 显示标签

 

6.4 combobox 标签

以下代码 都是基于 6.3

 

  combobox 标签生成一个单行文本框和下拉框的组合，但 2 个表单元素只对应一个请求参数，只有单行文本框的值才包含请求参数，而下拉列表框则只是用于辅助输入，并没有 name 属性，也就不会产生请求参数，需要指定一个 list  属性，该 list 属性指定的集合将用于生成列表项

s-combobox.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>使用s:combobox生成下拉输入框</title>	
<s:head/>
</head>
<body>
	<h3>使用s:combobox生成下拉输入框</h3>
	<s:form action="comboboxAction" method="post">
		<s:combobox label="请选择您喜欢的图书" theme="css_xhtml" 
			labelposition="top"
			list="{'Struts 2权威指南','轻量级Java EE企业应用实战','疯狂Ajax讲义'}"
			size="20" maxlength="20" name="book"></s:combobox>
		<br></br>
		-----------------------------------------------
		<s:combobox theme="css_xhtml" 
			labelposition="top"
			list="#request.list"
			size="20" maxlength="20" name="name"></s:combobox>
		<br></br>
		-----------------------------------------------	
		<s:submit labelposition="top" ></s:submit>
	</s:form>
</body>
</html>

 ComboboxAction

package js;

import java.util.ArrayList;
import java.util.List;

import com.opensymphony.xwork2.ActionSupport;

public class ComboboxAction extends ActionSupport {

    private String name = "";
    private String book = "";

    private List<String> list = new ArrayList<String>();

    @Override
    public String execute() throws Exception {
        System.out.println("name : " + name);
        System.out.println("book : " + book);
        list.add("我");
        list.add("你");
        list.add("他");
        return SUCCESS;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public List<String> getList() {
        return list;
    }

    public void setList(List<String> list) {
        this.list = list;
    }

    public String getBook() {
        return book;
    }

    public void setBook(String book) {
        this.book = book;
    }
}

 struts.xml

<?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.2.dtd">

<struts>
	<constant name="struts.custom.i18n.resources"
		value="messageResource"/>
	<constant name="struts.i18n.encoding" value="GBK"/>
	
	<package name="js"  extends="struts-default" namespace="/09">		
		
		<action name="comboboxAction" class="js.ComboboxAction">
			<result name="success">/09/s-combobox.jsp</result>  
		</action>
		
		<action name="">
			<result>.</result>
		</action>
	</package>
	
</struts>

 

<s:a href="" onclick="newWin('09/comboboxAction.action');" cssStyle="cursor: hand;">s-combobox.jsp</s:a>

 生成的 html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>使用s:combobox生成下拉输入框</title>	
<link rel="stylesheet" href="/struts2/struts/xhtml/styles.css" type="text/css"/>
<script src="/struts2/struts/utils.js" type="text/javascript"></script>
</head>
<body>
	<h3>使用s:combobox生成下拉输入框</h3>

	<form id="comboboxAction" name="comboboxAction" action="/struts2/09/comboboxAction.action;jsessionid=B66681BF1CF57AA3F4364F8B5C8C8F6C" method="post">
<table class="wwFormTable">
		<div id="wwgrp_comboboxAction_book" class="wwgrp">
<div id="wwlbl_comboboxAction_book" class="wwlbl">
<label for="comboboxAction_book" class="label">        请选择您喜欢的图书:
</label></div> <br /><div id="wwctrl_comboboxAction_book" class="wwctrl">
<script type="text/javascript">
	function autoPopulate_comboboxAction_book(targetElement) {
		targetElement.form.elements['book'].value=targetElement.options[targetElement.selectedIndex].value;
	}
</script>
<input type="text" name="book" size="20" maxlength="20" value="" id="comboboxAction_book"/><br />
<select onChange="autoPopulate_comboboxAction_book(this);">
    <option value="Struts 2权威指南">Struts 2权威指南</option>

    <option value="轻量级Java EE企业应用实战">轻量级Java EE企业应用实战</option>
    <option value="疯狂Ajax讲义">疯狂Ajax讲义</option>
</select>
</div> </div>


		<br></br>
		-----------------------------------------------
		<div id="wwgrp_comboboxAction_name" class="wwgrp">
<div id="wwctrl_comboboxAction_name" class="wwctrl">

<script type="text/javascript">
	function autoPopulate_comboboxAction_name(targetElement) {
		targetElement.form.elements['name'].value=targetElement.options[targetElement.selectedIndex].value;
	}
</script>
<input type="text" name="name" size="20" maxlength="20" value="" id="comboboxAction_name"/><br />
<select onChange="autoPopulate_comboboxAction_name(this);">
    <option value="我">我</option>
    <option value="你">你</option>
    <option value="他">他</option>
</select>
</div> </div>

		<br></br>
		-----------------------------------------------	
		<tr>
    <td colspan="2"><div align="right"><input type="submit" id="comboboxAction_0" value="Submit"/>
</div></td>
</tr>

	</table></form>

</body>
</html>

 

6.5 doubleselect 标签

以下代码 都是基于 6.3

 

  doubleselect 标签会生成一个级联列表框，选择第一个下拉框时，第二个下拉框内容会随之改变

 

常用属性：
　●　list ： 指定用于输出第一个下拉列表框中的选项集合
　●　listKey ： 指定集合元素中的某个属性（例如集合元素为 Person 实例，指定 Person 实例的 name 属性） 作为第一个下拉列表框的 value。如果集合是 map ，则可以使用 key 和 value 分别代表 Map 对象的 key 和 value 作为复选框的 value
　●　listValue ： 指定集合元素中的某个属性，作为复选框的标签。
　●　doubleList ： 指定用于第二个下拉列表框中选项的集合
　●　doubleListKey ： 指定集合元素中的某个属性，作为第二个下拉列表框的 value
　●　doubleListValue ： 指定集合元素中的某个属性，作为第二个下拉列表框的标签
　●　doubleName ： 指定第二个下拉列表框的 name 属性。

 

s-doubleselect.jsp

<%@ page contentType="text/html; charset=GBK" language="java" errorPage="" %>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>使用s:doubleselect生成级联下拉列表框</title>
<s:head/>
</head>
<body>
<h3>使用s:doubleselect生成级联下拉列表框</h3>
<s:form action="doubleselectAction" method="post" theme="css_xhtml">
	<s:doubleselect
		label="请选择您喜欢的图书" theme="css_xhtml"
		name="author2" list="{'李刚', 'David'}"	
		doubleList="top == '李刚' ? {'Struts 2权威指南',	'轻量级Java EE企业应用实战','疯狂Ajax讲义'}:{'JavaScript: The Definitive Guide'}" 
		doubleName="book2"></s:doubleselect>	
<br/>
-------------------------------------------		
<h3>使用s:doubleselect生成级联下拉列表框</h3>
<!-- 创建一个复杂的Map对象，key为普通字符串，value为集合 -->
<s:set name="bs1" 
	value="#{'李刚': {'Struts 2权威指南', '轻量级Java EE企业应用实战','疯狂Ajax讲义'},
	'David': {'JavaScript: The Definitive Guide'},	'Johnson': {'Expert One-on-One J2EE Design and Development'}}"/>
<!-- 使用Map对象来生成级联列表框 -->
	<s:doubleselect
		label="请选择您喜欢的图书" theme="css_xhtml"
		size="3"
		name="author3" list="#bs1.keySet()"
		doubleList="#bs1[top]" 
		doubleSize="3"
		doubleName="book3"></s:doubleselect>	
<br/>
-------------------
<s:doubleselect name="name" list="%{list}" doubleList="#request.map[top]"  doubleName="book" theme="css_xhtml"></s:doubleselect>
<br/>
----------------
<s:doubleselect name="name1" list="#request.map.keySet()" doubleList="#request.map[top]"  doubleName="book1" theme="css_xhtml"></s:doubleselect>
<br/>
--------------------------------------
<br/>
<s:submit theme="css_xhtml" align="left"></s:submit>
</s:form>
</body>
</html>

DoubleselectAction 

package js;

import java.util.*;
import com.opensymphony.xwork2.ActionSupport;

public class DoubleselectAction extends ActionSupport {

    private String name = "";
    private String book = "";
    private String name1 = "";
    private String book1 = "";

    private List<String> list = new ArrayList<String>();
    private Map<String, String[]> map = new HashMap<String, String[]>();

    @Override
    public String execute() throws Exception {
        System.out.println("name : " + name);
        System.out.println("book : " + book);
        System.out.println("name1 : " + name1);
        System.out.println("book1 : " + book1);
        list.add("我");
        list.add("你");
        list.add("他");
        map.put("我", new String[]{"a", "啦", "咯"});
        map.put("你", new String[]{"b", "比", "比比"});
        map.put("他", new String[]{"c", "擦", "擦擦"});
        return SUCCESS;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public List<String> getList() {
        return list;
    }

    public void setList(List<String> list) {
        this.list = list;
    }

    public String getBook() {
        return book;
    }

    public void setBook(String book) {
        this.book = book;
    }

    public Map<String, String[]> getMap() {
        return map;
    }

    public void setMap(Map<String, String[]> map) {
        this.map = map;
    }

    public String getName1() {
        return name1;
    }

    public void setName1(String name1) {
        this.name1 = name1;
    }

    public String getBook1() {
        return book1;
    }

    public void setBook1(String book1) {
        this.book1 = book1;
    }
}

struts.xml

<?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.2.dtd">

<struts>
	<constant name="struts.custom.i18n.resources"
		value="messageResource"/>
	<constant name="struts.i18n.encoding" value="GBK"/>
	
	<package name="js"  extends="struts-default" namespace="/09">		
		
		<action name="doubleselectAction" class="js.DoubleselectAction">
			<result name="success">/09/s-doubleselect.jsp</result>  
		</action>		
		
	</package>	
</struts>

 

<s:a href="" onclick="newWin('09/doubleselectAction.action');" cssStyle="cursor: hand;">s-doubleselect.jsp</s:a>

 

6.6 head 标签

以下代码 都是基于 6.3

 

  该标签主要生成 HTML <head/> 部分。因为有些主题要包含特定的 CSS 和 JavaScript 代码，而该标签则用于生成对这些 CSS 和 JavaScript 代码的引用。
  例如： 如果需要在页面中使用 Ajax 组件，则使用一个带 theme = "ajax" 属性的 head 标签，就可以将标准 Ajax 的头信息包含在页面里
  使用 Ajax 主题时，可以通过设置 head 的 debug 参数为 true ，从而打开调试标志。
 
 注意： 一般使用 Struts 2 的 UI 标签 、 JavaScript 客户端校验等需要 JavaScript 库和 CSS 支持功能时，都应该先使用 head 标签

 

 

6.7 optiontransferselect 标签

以下代码 都是基于 6.3

 

  optiontransferselect 会生成 2 个列表选择框，并生成系列的按钮用手控制各选项在 2 个下拉列表之间的移动、升降等。当提交表单时，2 个列表选择框对应的请求参数都会被提交。
 
  常用属性：
  　●　addAllToLeftLabel ： 设置全部移动到左边按钮上的文本
  　●　addAllToRightLabel ： 设置全部移动到右边按钮上的文本
  　●　addToLeftLabel ： 设置向左边移动按钮上的文本
  　●　addToRightLabel ： 设置向右边移动按钮上的文本
  　●　allowAddAllToLeft ： 设置是否出现全部移动到左边的按钮
  　●　allowAddAllToRight ： 设置是否出现全部移动到右边的按钮
  　●　allowAddToLeft ： 设置是否出现移动到左边的按钮
  　●　allowAddToRight ： 设置是否出现移动到右边的按钮
  　●　leftTitle ： 设置左边列表框的标题
  　●　rightTitle ： 设置右边列表框的标题
  　●　allowSelectAll ： 设置是否出现全部选择按钮
  　●　selectAllLabel ： 设置全部选择按钮上的文本
  　●　doubleList ： 必填。 设置用于创建第二个下拉选择框的集合
  　●　doubleListKey ： 设置创建第二个下拉选择框的选项 value 的属性
  　●　doubleListValue ： 设置创建第二个下拉选择框的选项 label 的属性
  　●　doubleName ： 必填。 设置第二个下拉选择框的 name 属性。
  　●　doubleValue ： 设置第二个下拉选择框的 value 属性
  　●　doubleMultiple ： 设置第二个下拉选择框是否允许多选
  　●　list ： 必填。 设置用于创建第一个下拉选择框的集合
  　●　listKey ： 设置创建第一个下拉选择框的选项 value 的属性
  　●　listValue ： 设置创建第一个下拉选择框的选项 label 的属性
  　●　name ： 设置第一个下拉选择框的 name 属性
  　●　value ： 设置第一个下拉选择框的 value 属性
  　●　multiple ： 设置第一个下拉选择框是否允许多选
 
 注意 ：  通常无需为 2 个列表框设置 id （id 和 doubleId ） ，因为会自动生成。 id 和 doubleId 分别为 <form_id>_<optiontransfeselect_name> 和 <form_id>_<doubleName>

s-optiontransferselect.jsp

<%@ page contentType="text/html; charset=GBK" language="java" errorPage="" %>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>使用s:optiontransferselect来生成可移动列表项的下拉列表框</title>
<s:head/>
</head>
<body>
<h3>使用s:optiontransferselect来生成可移动列表项的下拉列表框</h3>
<s:form action="optiontransferselectAction" method="post" theme="css_xhtml">
	<!-- 使用简单集合对象来生成可移动的下拉列表框 -->
	 <s:optiontransferselect 
	  	label="请选择你喜欢的图书"
		name="cnbook" 
		leftTitle="中文图书："
		rightTitle="外文图书"
		list="{'疯狂Java讲义' ,'Struts 2权威指南',
			'轻量级Java EE企业应用实战','疯狂Ajax讲义'}" 
		multiple="true"
		addToLeftLabel="向左移动"
		selectAllLabel="全部选择"
		addAllToRightLabel="全部右移"
		headerKey="cnKey"
		headerValue="--- 选择中文图书 ---"
		emptyOption="true"
		doubleList="{'Expert One-on-One J2EE Design and Development',
			'JavaScript: The Definitive Guide'}" 
		doubleName="enBook"
		doubleHeaderKey="enKey"
		doubleHeaderValue="--- 选择外文图书 ---" 
		doubleEmptyOption="true"
		doubleMultiple="true"
	/>
	<hr/>
	
	<!-- 使用简单集合对象来生成可移动的下拉列表框 -->
	 <s:optiontransferselect 
	  	label="请选择你喜欢的图书"
		name="cnbook1" 
		leftTitle="中文图书："
		rightTitle="外文图书"
		list="#request.list" 
		multiple="true"
		addToLeftLabel="向左移动"
		addToRightLabel="向右移动"
		selectAllLabel="全部选择"
		addAllToRightLabel="全部右移"
		addAllToLeftLabel="全部左移"
		headerKey="cnKey"
		headerValue="--- 选择中文图书 ---"
		emptyOption="true"
		doubleList="#request.list1" 
		doubleName="enBook1"
		doubleHeaderKey="enKey"
		doubleHeaderValue="--- 选择外文图书 ---" 
		doubleEmptyOption="true"
		doubleMultiple="true"
		leftUpLabel="Up"
		leftDownLabel="Down"
		rightDownLabel="Down"
		rightUpLabel="Up"
	/>
	<s:submit align="left"></s:submit>
</s:form>
</body>
</html>

 

OptiontransferselectAction

package js;

import java.util.*;
import com.opensymphony.xwork2.ActionSupport;

public class OptiontransferselectAction extends ActionSupport {

    private String cnbook = "";
    private String enBook = "";
    private String cnbook1 = "";
    private String enBook1 = "";

    private List<String> list = new ArrayList<String>();
    private List<String> list1 = new ArrayList<String>();

    @Override
    public String execute() throws Exception {
        System.out.println("cnbook : " + cnbook);
        System.out.println("enBook : " + enBook);
        System.out.println("cnbook1 : " + cnbook1);
        System.out.println("enBook1 : " + enBook1);
        list.add("我");       list.add("你");    list.add("他");
        list.add("罗塞拉利"); list.add("发大水"); list.add("烦噶事发生地方");
        
        list1.add("我1");       list1.add("你1");        list1.add("他1");
        list1.add("发撒反对");  list1.add("分三次方法");  list1.add("发挥好差错的");
        
        return SUCCESS;
    }

    public String getCnbook() {
        return cnbook;
    }

    public void setCnbook(String cnbook) {
        this.cnbook = cnbook;
    }

    public String getEnBook() {
        return enBook;
    }

    public void setEnBook(String enBook) {
        this.enBook = enBook;
    }

    public String getCnbook1() {
        return cnbook1;
    }

    public void setCnbook1(String cnbook1) {
        this.cnbook1 = cnbook1;
    }

    public String getEnBook1() {
        return enBook1;
    }

    public void setEnBook1(String enBook1) {
        this.enBook1 = enBook1;
    }

    public List<String> getList() {
        return list;
    }

    public void setList(List<String> list) {
        this.list = list;
    }

    public List<String> getList1() {
        return list1;
    }

    public void setList1(List<String> list1) {
        this.list1 = list1;
    }

    

      
}

 struts.xml

<?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.2.dtd">

<struts>
	<constant name="struts.custom.i18n.resources"
		value="messageResource"/>
	<constant name="struts.i18n.encoding" value="GBK"/>	
	<package name="js"  extends="struts-default" namespace="/09">		
		<action name="optiontransferselectAction" class="js.OptiontransferselectAction">
			<result name="success">/09/s-optiontransferselect.jsp</result>  
		</action>		
	</package>	
</struts>

 

<s:a href="" onclick="newWin('09/optiontransferselectAction.action');" cssStyle="cursor: hand;">s-optiontransferselect.jsp</s:a>

 HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>使用s:optiontransferselect来生成可移动列表项的下拉列表框</title>
<link rel="stylesheet" href="/struts2/struts/xhtml/styles.css"
	type="text/css" />
<script src="/struts2/struts/utils.js" type="text/javascript"></script>
</head>
<body>
<h3>使用s:optiontransferselect来生成可移动列表项的下拉列表框</h3>
<form id="optiontransferselectAction" name="optiontransferselectAction"
	action="/struts2/09/optiontransferselectAction.action;jsessionid=DDB05665D46B20A2E71F3CCE3D5A5E35"
	method="post"><!-- 使用简单集合对象来生成可移动的下拉列表框 -->
<div id="wwgrp_optiontransferselectAction_cnbook" class="wwgrp">
<div id="wwlbl_optiontransferselectAction_cnbook" class="wwlbl"><label
	for="optiontransferselectAction_cnbook" class="label">
请选择你喜欢的图书: </label></div>
<br />
<div id="wwctrl_optiontransferselectAction_cnbook" class="wwctrl">
<script type="text/javascript"
	src="/struts2/struts/optiontransferselect.js"></script>
<table border="0">
	<tr>
		<td><label for="leftTitle">中文图书：</label><br />

		<select name="cnbook" size="15" id="optiontransferselectAction_cnbook"
			multiple="multiple">
			<option value="cnKey">--- 选择中文图书 ---</option>
			<option value=""></option>
			<option value="疯狂Java讲义">疯狂Java讲义</option>
			<option value="Struts 2权威指南">Struts 2权威指南</option>
			<option value="轻量级Java EE企业应用实战">轻量级Java EE企业应用实战</option>
			<option value="疯狂Ajax讲义">疯狂Ajax讲义</option>


		</select> <input type="hidden"
			id="__multiselect_optiontransferselectAction_cnbook"
			name="__multiselect_cnbook" value="" /> <input type="button"
			onclick="moveOptionDown(document.getElementById('optiontransferselectAction_cnbook'), 'key', 'cnKey');"
			value="v" /> <input type="button"
			onclick="moveOptionUp(document.getElementById('optiontransferselectAction_cnbook'), 'key', 'cnKey');"
			value="^" /></td>
		<td valign="middle" align="center"><input type="button"
			value="向左移动"
			onclick="moveSelectedOptions(document.getElementById('optiontransferselectAction_enBook'), document.getElementById('optiontransferselectAction_cnbook'), false, 'enKey', '');" /><br />
		<br />
		<input type="button" value="-&gt;"
			onclick="moveSelectedOptions(document.getElementById('optiontransferselectAction_cnbook'), document.getElementById('optiontransferselectAction_enBook'), false, 'cnKey', '');" /><br />
		<br />
		<input type="button" value="&lt;&lt;--"
			onclick="moveAllOptions(document.getElementById('optiontransferselectAction_enBook'), document.getElementById('optiontransferselectAction_cnbook'), false, 'enKey', '');" /><br />
		<br />
		<input type="button" value="全部右移"
			onclick="moveAllOptions(document.getElementById('optiontransferselectAction_cnbook'), document.getElementById('optiontransferselectAction_enBook'), false, 'cnKey', '');" /><br />
		<br />

		<input type="button" value="全部选择"
			onclick="selectAllOptionsExceptSome(document.getElementById('optiontransferselectAction_cnbook'), 'key', 'cnKey');selectAllOptionsExceptSome(document.getElementById('optiontransferselectAction_enBook'), 'key', 'enKey');" /><br />
		<br />
		</td>
		<td><label for="rightTitle">外文图书</label><br />
		<select name="enBook" size="15" multiple="multiple"
			id="optiontransferselectAction_enBook">
			<option value="enKey">--- 选择外文图书 ---</option>
			<option value=""></option>
			<option value="Expert One-on-One J2EE Design and Development">Expert
			One-on-One J2EE Design and Development</option>
			<option value="JavaScript: The Definitive Guide">JavaScript:
			The Definitive Guide</option>

		</select> <input type="hidden"
			id="__multiselect_optiontransferselectAction_enBook"
			name="__multiselect_enBook" value="" /> <input type="button"
			onclick="moveOptionDown(document.getElementById('optiontransferselectAction_enBook'), 'key', 'enKey');"
			value="v" /> <input type="button"
			onclick="moveOptionUp(document.getElementById('optiontransferselectAction_enBook'), 'key', 'enKey');"
			value="^" /></td>
	</tr>
</table>
</div>
</div>

<hr />

<!-- 使用简单集合对象来生成可移动的下拉列表框 -->
<div id="wwgrp_optiontransferselectAction_cnbook1" class="wwgrp">
<div id="wwlbl_optiontransferselectAction_cnbook1" class="wwlbl">

<label for="optiontransferselectAction_cnbook1" class="label">
请选择你喜欢的图书: </label></div>
<br />
<div id="wwctrl_optiontransferselectAction_cnbook1" class="wwctrl">
<table border="0">
	<tr>
		<td><label for="leftTitle">中文图书：</label><br />
		<select name="cnbook1" size="15"
			id="optiontransferselectAction_cnbook1" multiple="multiple">
			<option value="cnKey">--- 选择中文图书 ---</option>
			<option value=""></option>
			<option value="我">我</option>

			<option value="你">你</option>
			<option value="他">他</option>
			<option value="罗塞拉利">罗塞拉利</option>
			<option value="发大水">发大水</option>
			<option value="烦噶事发生地方">烦噶事发生地方</option>


		</select> <input type="hidden"
			id="__multiselect_optiontransferselectAction_cnbook1"
			name="__multiselect_cnbook1" value="" /> <input type="button"
			onclick="moveOptionDown(document.getElementById('optiontransferselectAction_cnbook1'), 'key', 'cnKey');"
			value="Down" /> <input type="button"
			onclick="moveOptionUp(document.getElementById('optiontransferselectAction_cnbook1'), 'key', 'cnKey');"
			value="Up" /></td>
		<td valign="middle" align="center"><input type="button"
			value="向左移动"
			onclick="moveSelectedOptions(document.getElementById('optiontransferselectAction_enBook1'), document.getElementById('optiontransferselectAction_cnbook1'), false, 'enKey', '');" /><br />
		<br />
		<input type="button" value="向右移动"
			onclick="moveSelectedOptions(document.getElementById('optiontransferselectAction_cnbook1'), document.getElementById('optiontransferselectAction_enBook1'), false, 'cnKey', '');" /><br />
		<br />
		<input type="button" value="全部左移"
			onclick="moveAllOptions(document.getElementById('optiontransferselectAction_enBook1'), document.getElementById('optiontransferselectAction_cnbook1'), false, 'enKey', '');" /><br />
		<br />
		<input type="button" value="全部右移"
			onclick="moveAllOptions(document.getElementById('optiontransferselectAction_cnbook1'), document.getElementById('optiontransferselectAction_enBook1'), false, 'cnKey', '');" /><br />
		<br />
		<input type="button" value="全部选择"
			onclick="selectAllOptionsExceptSome(document.getElementById('optiontransferselectAction_cnbook1'), 'key', 'cnKey');selectAllOptionsExceptSome(document.getElementById('optiontransferselectAction_enBook1'), 'key', 'enKey');" /><br />
		<br />

		</td>
		<td><label for="rightTitle">外文图书</label><br />
		<select name="enBook1" size="15" multiple="multiple"
			id="optiontransferselectAction_enBook1">
			<option value="enKey">--- 选择外文图书 ---</option>
			<option value=""></option>
			<option value="我1">我1</option>
			<option value="你1">你1</option>

			<option value="他1">他1</option>
			<option value="发撒反对">发撒反对</option>
			<option value="分三次方法">分三次方法</option>
			<option value="发挥好差错的">发挥好差错的</option>
		</select> <input type="hidden"
			id="__multiselect_optiontransferselectAction_enBook1"
			name="__multiselect_enBook1" value="" /> <input type="button"
			onclick="moveOptionDown(document.getElementById('optiontransferselectAction_enBook1'), 'key', 'enKey');"
			value="Down" /> <input type="button"
			onclick="moveOptionUp(document.getElementById('optiontransferselectAction_enBook1'), 'key', 'enKey');"
			value="Up" /></td>

	</tr>
</table>
</div>
</div>

<div align="left" id="wwctrl_optiontransferselectAction_0"><input
	type="submit" id="optiontransferselectAction_0" value="Submit" /></div>
</form>

<script type="text/javascript">
	var containingForm = document.getElementById("optiontransferselectAction");
	StrutsUtils.addEventListener(containingForm, "submit", function(evt) {
		var selectObj = document
				.getElementById("optiontransferselectAction_cnbook");
		selectAllOptionsExceptSome(selectObj, "key", "cnKey");
	}, true);
	StrutsUtils.addEventListener(containingForm, "submit", function(evt) {
		var selectObj = document
				.getElementById("optiontransferselectAction_cnbook1");
		selectAllOptionsExceptSome(selectObj, "key", "cnKey");
	}, true);
	var containingForm = document.getElementById("optiontransferselectAction");
	StrutsUtils.addEventListener(containingForm, "submit", function(evt) {
		var selectObj = document
				.getElementById("optiontransferselectAction_enBook");
		selectAllOptionsExceptSome(selectObj, "key", "enKey");
	}, true);
	StrutsUtils.addEventListener(containingForm, "submit", function(evt) {
		var selectObj = document
				.getElementById("optiontransferselectAction_enBook1");
		selectAllOptionsExceptSome(selectObj, "key", "enKey");
	}, true);
</script>
</body>
</html>

--------------------------