ui标签是什么
来源：互联网 发布：ubuntu主题包下载 编辑：程序博客网 时间：2024/04/30 23:39
8.4 UI标签
8.4.1概述
UI标签是用来生成Web界面，或者为Web界面提供某些功能支持的标签，比如：表单标签就是把各种途径获取的需要展示的数据，通过动态生成HTML的形式展示到界面上。
UI标签分成如下几种：
- Form Tags：表单标签，包含所有可以用在Form表单里面的标签
- Non-Form UI Tags：非表单标签，主要包含错误展示、组件等
- Ajax Tags：用来支持Ajax的标签，这个在后面有专门的章节来学习
8.4.2 模板和主题
在进入具体的UI标签学习之前，有必要先理解主题和模板的概念，这对使用Struts2的UI标签非常重要，因为Struts2的UI标签的展示和实现是基于主题和模板的。
1：模板（Template）
所谓模板，就是一些代码，在Struts2中通常是用FreeMarker来编写的，标签使用这些代码能渲染生成相应的HTML代码。
一个标签需要知道自己显示什么数据，以及最终生成什么样的HTML代码。其中，显示什么数据往往是通过用户指定的OGNL表达式去值栈取；而最终生成什么样的HTML代码，就由一组FreeMarker的模板来定义，每个标签都会有自己对应的FreeMarker模板。这组模板在Struts2核心jar包（struts2-core-2.1.8.1.jar）的template包中。
2：主题（Theme）
所谓主题，就是一系列模板的集合。通常情况下，这一系列模板会有相同或类似的风格，这样能保证功能或视觉效果的一致性。
前面讲到，Struts2标签是使用一个模板来生成最终的html代码，这也就意味着，如果使用不同的模板，那么同一个标签所生成的HTML代码并不一样，也意味着不同的标签所生成的HTML代码的风格也可能不一样。
这就带来一个麻烦，一个页面会使用很多标签，如果每个标签所生成的HTML代码的风格不一样的话，这个页面会很杂乱，那么怎么统一这多个标签的功能或者风格呢？
答案自然就是主题，每一个主题包含一系列的模板，这些模板就会有相同或类似的风格，从而解决上面的问题。这也意味着，在Struts2里面，可以通过切换主题来切换标签成成的HTML的风格。
3：Struts2的内建主题：
Struts2提供了4种内建的主题，可以满足绝大多数的应用，当然，我们也可以自定义主题。4种内建主题分别是：
- simple：只生成最基本的HTML元素，没有任何附加功能。
- xhtml：在simple的基础上提供附加功能，提供布局功能、Label显示名称、以及与验证框架和国际化框架的集成。
- css_html：在xhtml的基础之上，添加对CSS的支持和控制。
- ajax：继承自xhtml，提供ajax的支持。
在4种内建主题中，Struts2以xhtml为默认主题。但是，xhtml主题有一定的局限性，因为它使用表格进行布局，它只支持每一行放一个表单项，这样一来，要是复杂的页面布局，它就很难胜任了。
那么如何改变Struts2的默认主题呢？
可以通过设置常量struts.ui.theme，来改变默认主题，具体做法是在struts.xml或者struts.properties中增加相应的配置。比如现在想要使用simple的主题，那么在struts.xml中增加如下的配置：
- <constant name="struts.ui.theme" value="simple"/>
或在struts.properties中增加如下的配置：
- struts.ui.theme =simple
8.4.3表单标签的通用属性
对于Struts2的表单标签，大都是动态来生成HTML代码的，因此有很多的属性都是通用的，也就是大多表单标签都有的一些属性，下面一起来看一下。
1：name属性和value属性
表单标签的name属性和value属性基本等同于HTML组件的name和value，但是也有一些不一样的地方：表单标签在生成HTML的时候，如果标签没有设置value属性的话，就会从值栈中按照name获取相应的值，把这个值设置成生成的HTML组件的value。
简单点说表单标签的value在生成HTML的时候会自动设置值，值从值栈中获取。
2：其他通用属性
除了name属性和value属性之外，多数Struts2的表单标签还有几组通用属性：
- 与css相关的属性：
l cssClass：指定生成的HTML组件的class属性。
l cssStyle：指定生成的HTML组件的style属性，使用内联的css属性。
l cssErrorClass：指定验证失败时引用的css属性。
l cssErrorStyle：指定验证失败时引用的内联css属性。
- 与触发事件相关的属性：
l onblur：指定生成的HTML组件失去焦点时触发的事件。
l onchange：指定生成的HTML组件内容改变时触发的事件。
l onclick：指定生成的HTML组件被单击时触发的事件。
l ondbclick：指定生成的HTML组件被双击时触发的事件。
l onfocus：指定生成的HTML组件获得焦点时触发的事件。
l onkeydown：指定在生成的HTML组件中按下键盘时触发的事件。
l onkeypress：指定在生成的HTML组件中按下并释放键盘时触发的事件。
l onkeyup：指定在生成的HTML组件中释放键盘时触发的事件。
l onmousedown：指定在生成的HTML组件中按下鼠标时触发的事件。
l onmousemove：指定在生成的HTML组件中鼠标移动时触发的事件。
l onmouseout：指定鼠标移动出生成的HTML组件时触发的事件。
l onmouseover：指定鼠标移动入生成的HTML组件时触发的事件。
l onmouseup：指定释放鼠标按键时触发的事件。
l onselect：指定生成的HTML组件中选中区域改变时触发的事件。
- 与悬浮提示相关的属性：
l jsTooltipEnabled：是否允许用javascript来生成悬浮提示。
l tootip：悬浮提示的内容。
l tooltipDelay：悬浮提示出现的延迟时间，以毫秒为单位。
l tooltipIcon：悬浮提示使用的图标的URL路径。
- 其他来源于html的属性：
l accesskey：指定快捷键，如果设置这个属性为x，按Alt+x就可以快速定位到这个生成的HTML组件。
l disabled：生成的HTML组件是否可用。
l id：指定生成的HTML组件的id。
l tabindex：指定生成的HTML组件的tab顺序的索引。
l title：指定生成的HTML组件的标题信息。
- 与提示文本相关的属性：
l label：用来显示在HTML组件前的文本。
l key：同label一样，也是用来显示在HTML组件前的文本，但是其内容取自国际化信息。
l labelposition：标签文本显示的位置，可以选择top或left。
- 与模板和主题相关的属性：
l template：指定使用的模板。
l templateDir：指定使用的模板所在的目录。
l theme：指定使用的主题。
- 与是否为必填项相关的属性。
l required：指定此生成的HTML组件是否为必填项。
l requiredposition：指定此生成的HTML组件是必填项时提示信息显示的位置，可以选择left或right。
8.4.4form标签
在Web应用中，页面上的HTML组件，通常情况下会被组织在form里面，所以有些朋友也称Web页面为表单，接下来就先来学习form标签。
由于Struts2的表单标签最终会生成HTML组件，也就是说Struts2的表单标签会在HTML标签中找到对应的标签，比如Struts2的form标签就对应着HTML的form标签。
因此在学习Struts2的表单标签的时候，完全类比着HTML的相应标签来学，大多数的属性和功能都是一样的，就不再去赘述，这里只重点讲述一下Struts2的表单标签与HTML的相应标签相比有些什么差异就可以了。
1：action的设置不同
设置HTML的form标签的action属性时，如果在同一个服务器上，那么要从web上下文开始指定，比如：
- <form action="/helloworld/ognlAction.action" method="post">
上面示例的action的值中，开头的“/helloworld”就是web上下文。
而Struts2的form标签在设置action属性的时候，因为使用Struts2的form标签的应用，只能提交给本应用，也就是说，只需要从自己的web应用开始就可以了，不需要再指定web上下文了，示例如下：
- <s:form action="/ognlAction.action" method="post">
如果确定页面是要提交到某个Action中，Struts2还提供了其他的写法，可以直接用namespace属性来指定Action所在的命名空间，这样action属性只需要指定Action名称即可，示例如下：
- <s:form action="sampleAction" namespace="/testNameSpace">
2：Struts2的form标签中的其他属性设置
对于Struts2的form标签来说，可以使用theme属性来指定它的主题，示例如下：
- <s:form action="/ognlAction.action" method="post" theme="simple">
要注意一点，由于几乎所有的Struts2的表单标签都可以指定主题，那么必然会出现主题冲突的情况，对于这一点，其覆盖顺序为：
- 表单内的表单标签的主题覆盖表单的主题，比如：表单内有一个文本域，定义如<s:textfield theme="simple"/>，而表单的定义如：<s:form theme="css_xhtml"/>，那么对于这个文本域，它的主题就是simple，而不是表单上指定的css_xhtml。
- 表单的主题又覆盖默认设置，比如在struts.xml或struts.properties文件中的主题设置
- 如果都没有设置主题，那么默认是xhtml的。
8.4.5文本域型标签
1：单行文本框textfield
单行文本框是表单域中最常见的了，textfield标签对应着HTML的<input type=”text”>，用于生成单行文本。
除了上面列出的各种常见通用属性，textfield标签还有几个其它的属性：
- maxlength：单行文本框中所能容纳的最大文本长度。
- size：单行文本框自身的长度。
- readonly：单行文本框是否只读。
2：多行文本框textarea
多行文本框用来输入一段可能很长的带有回车的文本。textarea标签对应HTML中的<textarea>。
除了上面列出的各种常见通用属性，textarea标签还有几个其它的属性：
- cols：列数。
- rows：行数。
- readonly：多行文本是否只读。
- wrap：指定多行文本框中的内容是否自动换行。
textarea标签和HTML的textarea标签在指定默认值的时候稍稍有一点区别，HTML中的textarea标签指定默认值的时候，必须使用<textarea>标签内的文本，其value属性不起作用，示例如下：
- <textarea>默认值</textarea>
而textarea标签指定默认值的时候与HTML的<textarea>正好相反，必须使用value属性，而不是标签内的文本，示例如下：
- <s:textarea value=”默认值”/>
3：密码框password
密码框用来输入一段单行文本，但是不会明文显示，而是用掩码代替。password标签对应<input type=”password”>。
除了上面列出的各种常见通用属性，password标签还有几个其它的属性：
- maxlength：单行文本框中所能容纳的最大文本长度。
- size：单行文本框自身的长度。
- readonly：单行文本框是否只读。
- showPassword：是否显示初始值，即使显示也仍为密文显示，用掩码代替。
Struts2的password标签和HTML的<input type=”password”>标签有小小的不同，<input type=”password”>只要设置value属性就可以将value属性的值作为默认值显示；但是Struts2的password标签除了要设置value属性，还要设置showPassword属性为true。
8.4.5选择型标签
选择型标签用于在一组已经存在的选项中选出一个或多个值。
1：单选框组radio
用来生成一系列单选框，用户只能选择其中的一个。Struts2的radio标签对应于HTML的<input type=”radio”>。
除了上面列出的各种常见通用属性，radio标签还有几个其它的属性：
- list：用于生成单选框的集合，必须配置
- listKey：生成的radio的value属性。
- listValue：生成的radio后面显示的文字。
这三个属性一定要配合使用，由list属性指定从哪个集合中获得元素，由listKey属性指定获得元素之后使用元素的哪个属性作为生成的<input type=”radio”>的value属性，由listValue属性指定生成的<input type=”radio”>后的给用户看的文字，示例如下：
- <%@ taglib prefix="s" uri="/struts-tags" %>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um">
- <s:param name="userId">user1</s:param>
- <s:param name="name">第一个用户</s:param>
- </s:bean>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um2">
- <s:param name="userId">user2</s:param>
- <s:param name="name">第二个用户</s:param>
- </s:bean>
- <s:set value="{#um,#um2}" var="list"/>
- <s:radio name="radio1" list="#list" listKey="userId" listValue="name"/>
在上面的代码中，首先用两个<s:bean/>标签生成了两个对象，并放到值栈里；然后用<s:set/>标签将两个对象组合成一个集合，并把集合也放到值栈里；最后用<s:radio/>标签生成一系列的单选框。
还可以为这组单选框指定默认选中的值，比如上面的示例中，<s:radio/>的name属性为radio1，在前面通用属性中介绍过，Struts2的UI标签，会在页面初始化的时候，按照name向值栈取值，这里就会去值栈中获取名称为radio1的值，如果取道的值和list中的某一个元素的listKey属性相等，则生成的单选框会被选中。
那么在上面的示例中，只需要在Action中添加一个radio1的属性，然后提供相应的getter方法，并在这个方法返回想要选中的值，当然这个值是要与listKey所指定的userId的值相对应，这里就是user1或者user2，比如要选中user2这个，在Action中就可以这么写，示例如下：
- private String radio1="user2";
- public String getRadio1(){
- return radio;
- }
2：复选框组checkboxlist
复选框组用来生成一系列复选框，用户可以选择其中的零到多个。Struts2的checkboxlist标签用来生成一组<input type=”check”>。
Struts2的checkboxlist标签与Struts2的radio标签的属性及其相似，其主要属性也有三个，而且用法也一模一样：
- list：用于生成多选框的集合。
- listKey：生成的checkbox的value属性。
- listValue：生成的checkbox后面显示的文字。
三个属性的用法与Struts2的radio标签一模一样，不再赘述，示例如下
- <%@ taglib prefix="s" uri="/struts-tags" %>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um">
- <s:param name="userId">user1</s:param>
- <s:param name="name">第一个用户</s:param>
- </s:bean>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um2">
- <s:param name="userId">user2</s:param>
- <s:param name="name">第二个用户</s:param>
- </s:bean>
- <s:set value="{#um,#um2}" var="list"/>
- <s:checkboxlist name="checkbox1" list="#list" listKey="userId" listValue="name"/>
在上面的代码示例中，只是把原来的<s:radio/>换成了<s:checkboxlist/>，属性的设置都不用变化，仍然是用list集合来生成复选框组，使用其中的元素的userId属性来作为<input type=”checkbox”>的value属性，使用其中的元素的name属性来作为<input type=”checkbox”>后显示的文字。
还可以为这组复选框指定默认选中的值，比如上面的示例中，<s: checkboxlist />的name属性为checkbox1，在前面通用属性中介绍过，Struts2的UI标签，会在页面初始化的时候，按照name向值栈取值，这里就会去值栈中获取名称为checkbox1的值，如果取道的值和list中的某一个元素的listKey属性相等，则生成的复选框会被选中。
那么在上面的示例中，只需要在Action中添加一个checkbox1的属性，然后提供相应的getter方法，并在这个方法返回想要选中的值，由于是复选框，也就是可能会有多个复选框被选中，因此这里的类型应该是字符串数组。当然这些值是要与listKey所指定的userId的值相对应的，这里就是user1或者user2，比如要同时选中user1和user2，在Action中就可以这么写，示例代码如下：
- private String[] checkbox1;
- public String[] getCheckbox1(){
- checkbox1 = new String[2];
- checkbox1[0] = "user1";
- checkbox1[1] = "user2";
- return checkbox1;
- }
3：下拉框select
Struts2的select标签用来生成一个下拉框，用户可以选择其中的一个，当然，像HTML的<select>标签一样，通过设置multiple属性，也可以让用户同时选择其中的多个选项。
除了上面列出的各种常见通用属性，select标签还有几个其它的属性：
- list：用于生成下拉框的集合。
- listKey：生成的选项的value属性。
- listValue：生成的选项显示的文字。
- headerKey：在所有的选项前再加额外的一个选项作为其标题的value属性。
- headerValue：在所有的选项前再加额外的一个选项作为其标题的显示文字。
- emptyOption：是否在标题和真实的选项之间加一个空选项。
- multiple：用户是否可以同时选择多项。
- size：下拉框的高度，即最多可以同时显示多少个选项。
在以上的属性中，list、listKey和listValue三个属性与前面的Struts2的radio标签中的属性是一样的，不再赘述。
headerKey属性和headerValue属性同时使用，可以在所有的真实选项（来源于list属性的选项）之前加一项作为标题项。比如，选择用户的时候，可以在所有的具体用户出现之前加一项“请选择”，这个项不作为备选的值。
emptyOption属性可以设置一个布尔值，指定是否在标题和真实的选项之间加一个空选项。
multiple属性和size属性类似于HTML的<select>标签，size属性可以让下拉框同时显示多个值，multiple属性让用户可以同时选择多个值，当然，后面的Action在接收这种下拉框的输入的时候，也不能直接使用String，应该使用String[]或List<String>。
看个示例会更清楚些，示例代码如下：
- <%@ taglib prefix="s" uri="/struts-tags" %>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um">
- <s:param name="userId">user1</s:param>
- <s:param name="name">第一个用户</s:param>
- </s:bean>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um2">
- <s:param name="userId">user2</s:param>
- <s:param name="name">第二个用户</s:param>
- </s:bean>
- <s:set value="{#um,#um2}" var="list"/>
- <s:select name="select1" list="#list" listKey="userId" listValue="name"
- headerKey="" headerValue="请选择用户"
- multiple="true" size="5"/>
跟前面的radio和select一样，只需要在Action中添加一个select1的属性，然后提供相应的getter方法，并在这个方法返回想要选中的值，由于可以多选，因此这里的类型应该是字符串数组。当然这些值是要与listKey所指定的userId的值相对应的，这里就是user1或者user2，比如要同时选中user1和user2，在Action中就可以这么写，示例代码如下：
- private String[] select1;
- public String[] getSelect1(){
- select1 = new String[2];
- select1[0] = "user1";
- select1[1] = "user2";
- return select1;
- }
4：optgroup标签
经常与Struts2的select标签联用的标签还有optgroup标签，optgroup标签作为select标签的子标签，用来生成一组选项。
optgroup标签的主要属性有：
- list：用于生成下拉框选项的集合。
- listKey：生成的选项的value属性。
- listValue：生成的选项显示的文字。
- label：用于生成选项组的文本。
- <%@ taglib prefix="s" uri="/struts-tags" %>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um">
- <s:param name="userId">user1</s:param>
- <s:param name="name">第一个用户</s:param>
- </s:bean>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um2">
- <s:param name="userId">user2</s:param>
- <s:param name="name">第二个用户</s:param>
- </s:bean>
- <s:set value="{#um}" var="list1"/>
- <s:set value="{#um2}" var="list2"/>
- <s:select name="select1" list="#list1" listKey="userId" listValue="name">
- <s:optgroup label="新的用户" list="#list2" listKey="userId" listValue="name"/>
- </s:select>
在上面的示例代码中，首先用<s:bean/>标签建立了两个对象，然后用<s:set/>标签分别用一个对象组成了集合。最后，在使用<s:select/>标签的时候，其name、list、listKey和listValue四个属性都和平时一样，唯独多了一个子标签<s:optgroup/>标签，它会生成一组标签，其list、listKey、listValue三个属性的使用和<s:select/>标签一模一样，label指定了这组标签的名字，注意，它会生成一个选项“新的用户”，但是这个选项是不能选的，仅仅用来显示分组。
8.4.6其他简单标签
除了上面介绍的文本域型标签和选择型标签之外，还有一些比较简单的标签，基本都可以从html中找到对应的标签，其用法也差不多，而且也遵守前面总结过的通用属性，这里就不再赘述了。这些标签有：
- Struts2的hidden标签对应<input type=”hidden”>。
- Struts2的file标签对应<input type=”file”>。
- Struts2的reset标签对应<input type=”reset”>。
- Struts2的submit标签对应<input type=”submit”>。
- Struts2的label标签对应HTML的<label>。
- Struts2的checkbox标签对应一个<input type=”checkbox”>标签，它的特殊之处在于只能表达boolean值，它提交到Action的值只能是使用boolean类型的属性。前面的checkboxlist标签是用于生成一组复选框。
8.4.7复杂操作标签
Struts2的表单标签还提供了一些用于复杂操作的标签。这些标签在html里并没有直接对应的标签，一般都是通过简单表单域和一些JavaScript来实现多个表单域的联动，或单个表单域内的复杂操作，从而满足更复杂的需求。
1：head标签
Struts2的head标签虽然不产生页面上的表单项，但是我们有必要在讲述复杂操作标签之前对它进行阐述。由于复杂操作标签往往需要引用JavaScript，而这些JavaScript除了被嵌入到页面之外，有一些通用的功能还要引用外来的script.js，但是，我们并不需要手工去导入它。
仅仅把head标签放到页面内，没有任何的参数，它可以自动识别页面需要Strust2的哪些辅助性文件，并帮我们自动导入。比如某些Struts2的标签需要使用Struts2提供的某些js文件，那么head标签就可以自动发现并导入这些js文件。示例如下：
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
- <title>测试jsp</title>
- <s:head/>
- </head>
需要head标签的有：Struts2的updownselect标签和optiontransferselect标签等。
2：combobox标签
Struts2的combobox标签用于生成一个文本框和一个下拉框，下拉框出现在文本框的下面，在最终提交的时候只提交文本框的输入值，下拉框用于在其选项改变时，也就是onchange事件被触发时，把自身的被选中项的值赋到文本框上。
combobox的属性分别来自文本框和下拉框：
- 来自文本框的属性：
l maxlength：单行文本框中所能容纳的最大文本长度。
l size：单行文本框自身的长度。
l readonly：单行文本框是否只读。
- 来自下拉框的属性：
l list：用于生成下拉框的集合。
l listKey：生成的选项的value属性。
l listValue：生成的选项显示的文字。
还是来看个示例会比较清楚，示例代码如下： ='mso- mr�|� e� 611496'> 复杂操作标签
- <%@ taglib prefix="s" uri="/struts-tags" %>
- <s:form action="/ognlAction.action" method="post">
- <s:bean name="cn.javass.tag.vo.UserModel" var="um">
- <s:param name="userId">user1</s:param>
- <s:param name="name">第一个用户</s:param>
- </s:bean>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um2">
- <s:param name="userId">user2</s:param>
- <s:param name="name">第二个用户</s:param>
- </s:bean>
- <s:set value="{#um,#um2}" var="list"/>
- <s:combobox name="test" list="#list" listKey="userId" listValue="name"/>
- </s:form>
上面的示例代码会生成一个文本框和一个下拉框，在下拉框变化的时候，会将被选中的项的值放到文本框中。运行效果如下图：
图8.11 combobox的效果
要注意一点，combox的标签必须包含在Struts2的form标签或者是HTML的form标签内使用，为什么呢？来看看combox生成的HTML源码，你就明白了，源码如下：
- <script type="text/javascript">
- function autoPopulate_ognlAction_test(targetElement) {
- targetElement.form.elements['test'].value=targetElement.options[targetElement.selectedIndex].value;
- }
- </script>
- <input type="text" name="test" value="" id="ognlAction_test"/><br />
- <select onChange="autoPopulate_ognlAction_test(this);">
- <option value="user1">第一个用户</option>
- <option value="user2">第二个用户</option>
- </select>
注意查看生成的HTML中的js代码，combobox是从form的elements里面去寻找文本域的，因此必须要有form，否则js是无法正常运行的。
3：updownselect标签
Struts2的updownselect标签用来生成一个可以自由上下移动选项的下拉框。生成选项的用法和Struts2的select标签一样，都是list、listKey、listValue三个属性来设置，这里只需要了解关于上下操作的几个属性：
- allowMoveUp：是否显示“上移”按钮，默认为显示。
- allowMoveDown：是否显示“下移”按钮，默认为显示。
- allowSelectAll：是否显示“全选”按钮，默认为显示。
- moveUpLabel：上移按钮显示的文本。
- moveDownLabel：下移按钮显示的文本。
- selectAllLabel：全选按钮显示的文本。
这里需要特殊说明的是，在使用了Struts2的updownselect标签的页面里，必须配合使用Struts2的head标签，因为updownselect标签需要引用Struts2的utils.js，而head标签就会自动识别并引入它。
"'�;���|� ��� >headerValue属性同时使用，可以在所有的真实选项（来源于list属性的选项）之前加一项作为标题项。比如，选择用户的时候，可以在所有的具体用户出现之前加一项“请选择”，这个项不作为备选的值。
emptyOption属性可以设置一个布尔值，指定是否在标题和真实的选项之间加一个空选项。
multiple属性和size属性类似于HTML的<select>标签，size属性可以让下拉框同时显示多个值，multiple属性让用户可以同时选择多个值，当然，后面的Action在接收这种下拉框的输入的时候，也不能直接使用String，应该使用String[]或List<String>。
看个示例会更清楚些，示例代码如下：
- <%@ taglib prefix="s" uri="/struts-tags" %>
- <s:head/>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um">
- <s:param name="userId">user1</s:param>
- <s:param name="name">第一个用户</s:param>
- </s:bean>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um2">
- <s:param name="userId">user2</s:param>
- <s:param name="name">第二个用户</s:param>
- </s:bean>
- <s:set value="{#um,#um2}" var="list"/>
- <s:updownselect list="#list" name="user.userId" listKey="userId"
- listValue="name" allowMoveUp="true" allowMoveDown="true"
- allowSelectAll="true" moveUpLabel="Move Up"
- moveDownLabel="Move Down" selectAllLabel="Select All" />
这时候，下拉框的下面会出现三个按钮，分别是“Move Up”、“Move Down”和“Select All”，可以实现上移、下移、选择全部，页面如下图：
图8.12 updownselect的效果
你可以选中一个选项，然后去点击向上向下的按钮，看看效果。
4：optiontransferselect标签
Struts2的optiontransferselect标签用来生成两个下拉框，这两个下拉框左右放置，有按钮可以控制将选项在两个下拉框之间转移，在每个下拉框下还有按钮可以像updownselect标签那样控制选项上下移动。
optiontransferselect标签的主要属性可以分为4组：
- 控制左下拉框名字以及数据来源：
l name：左下拉框的name属性。
l list：用于生成左下拉框的集合。
l listKey：生成左下拉框的选项的value属性。
l listValue：生成左下拉框的选项显示的文字。
l headerKey：在左下拉框所有的选项前再额外加一个选项作为其标题，headerKy设置的是标题的value属性。
l headerValue：在左下拉框所有的选项前再额外加一个选项作为其标题，headerValue设置得是标题的显示文字。
- 控制右下拉框名字以及数据来源：
l doubleName：右下拉框的name属性。
l doubleList：用于生成右下拉框的集合。
l doubleListKey：生成右下拉框的选项的value属性。
l doubleListValue：生成右下拉框的选项显示的文字。
l doubleHeaderKey：在右下拉框所有的选项前再额外加一个选项作为其标题，headerKy设置的是标题的value属性。
l doubleHeaderValue：在右下拉框所有的选项前再额外加一个选项作为其标题，headerValue设置得是标题的显示文字。
- 控制两个下拉框之间的左右移按钮：
l allowAddAllToLeft：指定是否出现“全部移到左边”按钮。
l allowAddToLeft：指定是否出现“移到左边”按钮。
l allowAddToRight：指定是否出现“移到右边”按钮。
l allowAddAllToRight：指定是否出现“全部移到右边”按钮。
l addAllToLeftLabel：指定“全部移到左边”按钮上显示的文本。
l addAllToRightLabel：指定“全部移到右边”按钮上显示的文本。
l addToLeftLabel：指定“移到左边”按钮的上的文本。
l addToRightLabel：指定“移到右边”按钮的上的文本。
- 控制两个下拉框分别的上下移按钮。
l allowUpDownOnLeft：指定左边下拉框是否出现上下移按钮。
l allowUpDownOnRight：指定右边下拉框是否出现上下移按钮。
l leftUpLabel：指定左边下拉框上移按钮上显示的文本。
l leftDownLabel：指定左边下拉框下移按钮上显示的文本。
l rightUpLabel：指定右边下拉框上移按钮上显示的文本。
l rightDownLabel：指定右边下拉框下移按钮上显示的文本。
l allowSelectAll：指定两个下拉框是否显示选中全部按钮。
这个标签的属性比较多，也比较复杂，还是通过示例来说明，示例代码如下：
- <%@ taglib prefix="s" uri="/struts-tags" %>
- <s:head/>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um">
- <s:param name="userId">user1</s:param>
- <s:param name="name">第一个用户</s:param>
- </s:bean>
- <s:bean name="cn.javass.tag.vo.UserModel" var="um2">
- <s:param name="userId">user2</s:param>
- <s:param name="name">第二个用户</s:param>
- </s:bean>
- <s:set value="{#um,#um2}" var="list"/>
- <s:set value="{}" var="list2"/>
- <s:optiontransferselect name="userId1" doubleName="userId2"
- list="#list" listKey="userId" listValue="name"
- headerKey="" headerValue="请选择" doubleList="#list2"
- doubleListKey="userId" doubleListValue="name"
- doubleHeaderKey="" doubleHeaderValue="请选择"
- addAllToLeftLabel="全部左移" addAllToRightLabel="全部右移"
- addToLeftLabel="左移" addToRightLabel="右移"
- allowAddAllToLeft="true" allowAddToLeft="true"
- allowAddToRight="true" allowAddAllToRight="true"
- allowUpDownOnLeft="true" allowUpDownOnRight="true"
- leftUpLabel="上移" leftDownLabel="下移"
- rightUpLabel="上移" rightDownLabel="下移"
- allowSelectAll="false"
- />
在上面的代码中，仍然使用<s:bean/>标签定义了两个对象，使用<s:set/>标签将这两个对象分别放在两个集合里。使用<s:optiontransferselect/>标签生成的两个下拉框，分别以这两个对象作为数据源，并在代码里指定了两个下拉框之间有“全部左移”、“左移”、“右移”、“全部右移”四个按钮，而且两个下拉框分别有“上移”、“下移”两个按钮。在这里，还是要强调一下，前面必须引用<s:head/>标签，因为<s:optiontransferselect/>标签需要引用Struts2的utils.js。
运行结果如下图所示：
图8.13 optiontransferselect的效果
去操作试试看，是否如期望的效果。
5：doubleselect标签
Struts2的doubleselect标签用来生成两个联动的下拉框，当第一个下拉框的选项变化时，第二个下拉框的所有选项会跟随变化，会更新成与第一个下拉框选项相关的一组选项。比如，常用的省、市联动就可以用doubleselect标签来处理，省作为第一个下拉框，市作为第二个下拉框，当省的选项变化的时候，市的所有选项就跟着变化。
doubleselect标签的重要选项分为2组：
- 控制第一个下拉框名字以及数据来源：
l name：第一个下拉框的name属性。
l list：用于生成第一个下拉框的集合。
l listKey：生成第一个下拉框的选项的value属性。
l listValue：生成第一个下拉框的选项显示的文字。
l headerKey：在第一个下拉框所有的选项前再额外加一个选项作为其标题，headerKey设置的是标题的value属性。
l headerValue：在上边下拉框所有的选项前再额外加一个选项作为其标题，headerValue设置的是标题的显示文字。
- 控制第二个下拉框名字以及数据来源：
l doubleName：第二个下拉框的name属性。
l doubleList：用于生成第二个下拉框的集合。
l doubleListKey：生成第二个下拉框的选项的value属性。
l doubleListValue：生成第二个下拉框的选项显示的文字。
l doubleHeaderKey：在第二个下拉框所有的选项前再额外加一个选项作为其标题，headerKey设置的是标题的value属性。
l doubleHeaderValue：在下边下拉框所有的选项前再额外加一个选项作为其标题，headerValue设置的是标题的显示文字。
还是来看个示例，示例代码如下：
- <%@ taglib prefix="s" uri="/struts-tags" %>
- <s:form action="/ognlAction.action" method="post">
- <s:doubleselect label="请选择省市"
- name="province"
- doubleName="city"
- list="{'北京市','上海市'}"
- doubleList="(top=='北京市') ?
- {'东城区','西城区'}:{'徐汇区','浦东区'}
- "
- />
- </s:form>
在上面的代码中，<s:doubleselect/>标签的list属性直接指定了一个List集合，里面有两个元素；而doubleList属性的值是一个三目运算符，其中的top关键字代表第一个下拉框当前被选中的选项值，如果是“北京市”被选中，则把'东城区','西城区'两项被添加到下边的下拉框中，否则，将是'徐汇区','浦东区'两项被添加到第二个下拉框中。
运行效果如下图所示：
图8.14 doubleselect的效果
有朋友可能会说，那么有3个省市怎么办呢？很简单，继续嵌套三目运算符，示例如下：
- <%@ taglib prefix="s" uri="/struts-tags" %>
- <s:form action="/ognlAction.action" method="post">
- <s:doubleselect label="请选择省市"
- name="province"
- doubleName="city"
- list="{'北京市','上海市','重庆市'}"
- doubleList="(top=='北京市') ?
- {'东城区','西城区'}:
- ( top=='上海市'?
- {'徐汇区','浦东区'}:{'渝中区','沙坪坝区'}
- )
- "
- />
- </s:form>
去运行测试一下，看看效果。
私塾在线网站原创《研磨struts2》系列
转自请注明出处：【http://sishuok.com/forum/blogPost/list/0/4080.html】
- ui标签是什么
- struts组件,UI组件,标签,模板究竟是什么(1)
- struts组件,UI组件,标签,模板究竟是什么(2)
- UI是什么
- UI标签
- UI标签
- ui标签
- Struts2标签-UI标签
- ui到底是什么？
- UI设计 是什么
- <th>是什么标签
- Struts2标签之UI标签
- Struts2标签 逻辑标签和UI标签
- Struts2 UI标签
- struts2 UI标签示例
- struts2非UI标签
- struts2 UI标签示例
- liferay UI 标签
- MySQL实现远程登录的方法
- css定义格式中逗号，空格，冒号，点号的含义
- [转]一个关于epoll的例子
- get pid by name
- 宋兰-桌面GIS应用高效开发
- ui标签是什么
- android中event.getRepeatCount() == 0
- s3c2416 u-boot增加LCD驱动
- java Context（上下文）释义
- 每天学点English Email(商务性结尾5)
- 侧边栏(使用Support Library 4提供的扩展组件)
- C++ string leftTrim rightTrim Trim split
- shell scripts学习(二)
- linux下 ar 命令使用
