一、表单标签的通用属性
对于表单标签,分为两种标签:form标签本身,和所有来包装单个的表单元素的其他标签.form标签本身的行为不同于它内部的元素,这是很重要的.在我们为所有表单标签,包括form标签在内,提供一个参考手册之前,我们必须先描述一些通用的属性.
通用属性
属性 |
Theme |
数据类型 |
描述 |
cssClass |
simple |
String |
定义 html class 属性 |
cssStyle |
simple |
String |
定义html style 属性 |
title |
simple |
String |
定义html title 属性 |
disabled |
simple |
String |
定义html disabled 属性 |
label |
xhtml |
String |
定义表单元素的label |
labelPosition |
xhtml |
String |
定义表单元素的label位置(top/left),缺省为left |
requiredposition |
xhtml |
String |
定义required 标识相对label元素的位置 (left/right),缺省是 right |
name |
simple |
String |
表单元素的name映射 |
required |
xhtml |
Boolean |
在label中添加 * (true增加,否则不增加) |
tabIndex |
simple |
String |
定义html tabindex 属性 |
value |
simple |
Object |
定义表单元素的value |
模板相关属性
属性 |
Theme |
数据类型 |
描述 |
templateDir |
n/a |
String |
定义模板目录 |
theme |
n/a |
String |
定义theme名称 |
template |
n/a |
String |
定义模板名称 |
Javascript相关属性
属性 |
Theme |
数据类型 |
描述 |
onclick |
simple |
String |
html javascript onclick 属性 |
ondbclick |
simple |
String |
html javascript ondbclick 属性 |
onmousedown |
simple |
String |
html javascript onmousedown 属性 |
onmouseup |
simple |
String |
html javascript onmouseup 属性 |
onmouseover |
simple |
String |
html javascript onmouseover 属性 |
onmouseout |
simple |
String |
html javascript onmouseout 属性 |
onfocus |
simple |
String |
html javascript onfocus 属性 |
onblur |
simple |
String |
html javascript onblur 属性 |
onkeypress |
simple |
String |
html javascript onkeypress 属性 |
onkeyup |
simple |
String |
html javascript onkeyup 属性 |
onkeydown |
simple |
String |
html javascript onkeydown 属性 |
onselect |
simple |
String |
html javascript onselect 属性 |
onchange |
simple |
String |
html javascript onchange 属性 |
Tooltip 相关属性
属性 |
数据类型 |
缺省值 |
描述 |
tooltip |
String |
none |
设置此组件的tooltip |
tooltipIcon |
String |
/webwork/static/tooltip/tooltip.gif |
tooltip图标的url |
tooltipAboveMousePointer |
Boolean |
false |
在鼠标光标位置上放置tooltip.另外设置 tooltipOffseY 允许你设置从鼠标光标位置的垂直位移. |
tooltipBgColor |
String |
#e6ecff |
tooltip的背景色. |
tooltipBgImg |
String |
none |
背景图片. |
tooltipBorderWidth |
String |
1 |
tooltip边框的宽度. |
tooltipBorderColor |
String |
#003399 |
tooltip边框的背景色 |
tooltipDelay |
String |
500 |
显示Tooltip的时间延迟(毫秒). 类似基于操作系统的tooltip的行为. |
tooltipFixCoordinateX |
String |
not specified |
固定tooltip在指定的X坐标上.例如和tooltipSticky属性结合时很有用. |
tooltipFixCoordinateY |
String |
not specified |
固定tooltip在指定的Y坐标上.例如和tooltipSticky属性结合时很有用. |
tooltipFontColor |
String |
#000066 |
字体颜色. |
tooltipFontFace |
String |
arial,helvetica,sans-serif |
字体,例如 verdana,geneva,sans-serif |
tooltipFontSize |
String |
11px |
字体大小,例如 30px |
tooltipFontWeight |
String |
normal |
Font weight. 可以是 normal 或者 bold |
tooltipLeftOfMousePointer |
Boolean |
false |
在鼠标光标位置左侧的Tooltip位置 |
tooltipOffsetX |
String |
12 |
相对鼠标光标位置的水平位移. |
tooltipOffsetY |
String |
15 |
相对鼠标光标位置的垂直位移. |
tooltipOpacity |
String |
100 |
tooltip的透明度. 不透明度是行对透明度而言的.设置的值必须是一个介于0(完全透明)和100(不透明)之间的数字.Opera尚未支持. |
tooltipPadding |
String |
3 |
内部间隔,例如,边框和内容之间的空格,例如文字或者图片 |
tooltipShadowColor |
String |
#cccccc |
使用指定的颜色创建阴影. |
tooltipShadowWidth |
String |
5 |
使用指定的宽度(距离)创建阴影. |
tooltipStatic |
Boolean |
false |
就像基于操作系统的tooltip, tooltip不随着鼠标光标移动而移动. |
tooltipSticky |
Boolean |
false |
tooltip一直停留在它初始的位置,直到另外一个tooltip被激活,或者用户点击了文档. |
tooltipStayAppearTime |
String |
0 |
指定一个tooltip消失的时间间隔(毫秒),即时鼠标还在相关的HTML元素上不懂,设置<=0,就和没有定义一样. |
tooltipTextAlign |
String |
left |
调整包括标题和tooltip内容的文字位置.可以是right, left 或 justify |
tooltipTitle |
String |
none |
标题 |
tooltipTitleColor |
String |
#ffffff |
title文字的颜色 |
tooltipWidth |
String |
300 |
tooltip的宽度 |
二、表单标签
1、checkbox(复选框)
struts2的checkbox标签在使用的时候需要注意它的两个属性。value和fieldValue,在其他的标签中value是真实值。而在checkbox中,value如果为true,就表示复选框被选中;如果为false就表示不被选中。fieldValue才是此复选框对应的真实的值。
<s:checkbox name="xingming" value="false" fieldValue="aaaaa" label="value=false" />
<s:checkbox name="xingming" value="true" fieldValue="aaaaa" label="value=true"/>
结果:
|
|
2、checkboxlist(复选框组)
<s:checkboxlist name="a" label="请选择您喜欢的图书" labelposition="top"
list="{'struts2.0','hibernate','spring'}"/>
<!--用Map对象生成多个复选框-->
<s:checkboxlist name="b" label="请选择您喜欢的图书" labelposition="top"
list="#{'struts2.0':'2006/10','hibernate':'2007/8','spring':'2008/9'}"
listKey="key" listValue="value"/>
|
|
3、combobox(组合框)
combobox标签生成一个单行文本框和下拉列表框的组合,但值对应一个请求参数。
<s:combobox label="请选择您喜欢的图书" theme="css_xhtml" labelposition="top"
list="{'struts2.0','hibernate','spring'}" size="20" maxlength="20" name="book"/>
结果:
4、select(下拉菜单)
<s:select label="请选择您喜欢的书籍"
labelposition="top" name="books"
list="{'struts2.0','hibernate','spring','ajax'}"
multiple="true" size="2" required="true"/>
<s:select list="#{'struts':'aaaa','hibernate':'bbbb','spring':'cccc','ajax':'dddd'}"
listKey="key" listValue="value" label="选择你喜欢的作者" labelposition="top"
name="b" />
结果:
5、doubleselect
doubleselect标签会生成一个级联列表框,当选择第一个下拉列表,第二个下拉框的内容也会随之改变。
<s:set name="bs"
value="#{'数据标签':{'action','bean','date','set'},
'控制标签':{'iterator','append','subset'},'表单标签':{'select','checkbox','radio'}}"/>
<s:form action="x">
<s:doubleselect label="请选择您喜欢的图书" labelposition="top" size="3"
name="author" list="#bs.keySet()" multiple="false"
doubleName="book" doubleList="#bs[top]" doubleMultiple="false"
doubleSize="3"/>
</s:form>
结果:
6、optiontransferselect
<s:optiontransferselect
doubleList="{'javaScript','ajax','sql'}"
list="{'struts2.0','hibernate','spring'}"
name="cnbook" doubleName="enbook"
addAllToLeftLabel="全部向左移" addAllToRightLabel="全部向右移"
addToLeftLabel="向左移" addToRightLabel="向右移"
allowAddAllToLeft="true" allowAddAllToRight="true"
allowAddToLeft="true" allowAddToRight="true"
allowUpDownOnLeft="true"allowUpDownOnRight="true"
multiple="true" doubleMultiple="true"
emptyOption="true" doubleEmptyOption="true"
headerKey="cnKey" doubleHeaderKey="enKey"
headerValue="--选择中文图书--" doubleHeaderValue="--choose English book--"
allowSelectAll="true" selectAllLabel="全部选中"
leftTitle="中文图书" rightTitle="Einglish books"
leftDownLabel="下移" rightDownLabel="下移"
leftUpLabel="上移" rightUpLabel="上移"
label="图书管理"
>
</s:optiontransferselect>
结果:
|
7、radio
<s:radio name="a" label="选择您喜爱的图书" labelposition="top"
list="'struts','hibernate','spring'"/>
<s:radio name="b" label="选择您喜爱的图书" labelposition="top"
list="#{'struts':'111','hibernate':'222','spring':'333'}"
listKey="key" listValue="value"/>
<s:bean name="com.zzn.books.BookService" id="bs"/>
<s:radio name="c" label="选择您喜爱的图书" labelposition="top"
list="#bs.books" listKey="name" listValue="author"/>
结果:
8、optgroup
optgroup标签用于生成一个下拉列表框的选项组,因此,该标签必须放在<s:select.../>标签中使用。
<s:select name="book" label="选择你喜欢的作者" labelposition="top"
list="#{'struts':'aaaa','hibernate':'bbbb','spring':'cccc','ajax':'dddd'}"
listKey="key" listValue="value" >
<s:optgroup label="Rod Johnson"
list="#{'aaaaaaaa':'bbbbbbbb'}"
listKey="key" listValue="value"/>
<s:optgroup label="David Flanagan"
list="#{'javaScript:The Definitive Guide':'David'}"
listKey="key" listValue="value"/>
</s:select>
结果:
|
|
9、token
这是一个防止多次提交表单的标签,能避免刷新页面时多次提交,如果要该标签起作用,应该在struts.xml中用TokenInterceptor拦截器或TokenSessionStoreInerceptor拦截器。
<s:tolen/>
10、head
该标签主要用于生成HTML主要页面的HEAD部分。如果需要页面中有用Ajax组件,使用一个带theme=”ajax“属性的head标签,就可以将标准Ajax的头信息包含在页面中。
<s:head theme="ajax"/>
11、updownselect
<s:updownselect name="a" label="请选择您喜欢的图书" labelposition="top"
moveUpLabel="向上移动"
list="{'struts2.0','hibernate','spring'}"/>
<s:updownselect name="b" label="请选择您喜欢的图书" labelposition="top"
moveDownLabel="向下移动" selectAllLabel="全部选择"
list="#{'struts2.0':'2006/10','hibernate':'2007/8','spring':'2008/9'}"
listKey="key" listValue="value" emptyOption="true"/>
结果:
12、actionerror和actionmessage
actionerror和actionmessage这两个标签用法完全一样,都是负责输出Action实例里封装的信息,区别是actionerror标签负责输出Action市里的getActionError()方法的返回值,而actionmessage标签负责输出Action实例的getActionMessage()的返回值。
13、tree和treenode初步
注意:用这个标签加上<s:head theme="ajax"/>
<s:tree label="计算机图书" id="book" theme="ajax"
showRootGrid="true" showGrid="true" treeSelectedTopic="treeSelected">
<s:treenode label="张孝祥" id="zxx" theme="ajax">
<s:treenode label="java教程" id="java" theme="ajax"/>
<s:treenode label="javascript宝典" id="javascript" theme="ajax"/>
<s:treenode label="j2ee详解" id="j2ee" theme="ajax"/>
</s:treenode>
<s:treenode label="李刚" id="lg" theme="ajax" >
<s:treenode label="struts2.0" id="struts" theme="ajax"/>
<s:treenode label="spring" id="spring" theme="ajax"/>
<s:treenode label="hibernate" id="hibernate" theme="ajax"/>
</s:treenode>
<s:treenode label="David" id="d" theme="ajax" >
<s:treenode label="ajax" id="ajax" theme="ajax"/>
</s:treenode>
</s:tree>
13、datetimepicker(日历控件)
<s:datetimepicker name="order.date" label="购买日期" toggleType="explode" value="today"/>
结果: