1.在Struts2中UI标签的表单标签分为两种:form标签本身和单个表单标签。
2.Struts2表单标签包括:form、textfield、password、radio、checkbox、checkboxlist、select、doubleselect、combobox、optiontransferselect、optgroup、updownselect、textarea、hidden、file、label、submit、token、head、datepicker、reset、richtexteditor 等。
其中这些标签的意义如下:
form:输出一个form表单。
textfield:输出一个单行文本框。
password:输出一个密码框。
radio:输出一个单选框。
checkbox:输出一个复选框。
checkboxlist:输出一个复选框列表。
select:输出一个下拉框。
doubleselect:输出一个双选下拉框部件,第二个下拉框依赖第一个。
combobox:输出一个部件,可以从下拉框的内容填充一个文本框。
optiontransferselect:输出一个选项移动下拉组件,主要是两个下拉框和用来在两个下拉框之间移动选项的按钮。
updownselect:输出一个下拉框控件,带有上下按钮来移动下拉框组件元素。
textarea:输出一个多行文本框。
hidden:输出一个hidden表单字段。
file:输出一个文件选择框。
label:输出一个label。
submit:输出一个submit(提交)表单按钮。
token:输出一个隐藏的字段来防止多次提交表单。
head:输出对应theme的head部分的内容,比如Css和JavaScript的引用。
datepicker:输出一个日期选择部件,使用JavaScript和DOM。
reset:输出一个reset(重置)表单按钮。
richtexteditor:输出一个富文本编辑器。
3.对于Struts2的表单标签,大都是动态来生成HTML代码的,因此有很多的属性都是通用的,也就是大多表单标签都有的一些属性,接下来就来介绍一下:
(1).name属性和value属性:在Struts2的表单标签中的name属性和value属性基本等同于HTML组件的name属性和value属性,但有些不同的地方:Struts2的表单标签在动态生成HTML代码时,如果标签没有设置value属性的话,就会从值栈中按照name获取相应的值,把这个获取到的值设置成生成的HTML组件的value属性值。
(2).其他通用属性:除了上面的name属性和value属性之外,大多数Struts2的表单标签还有几组通用属性:
~~与css相关的属性:
cssClass:指定生成的HTML组件的class属性。
cssStyle:指定生成的HTML组件的style属性,使用内联的css属性。
cssErrorClass:指定验证失败时引用的css属性。
cssErrorStyle:指定验证失败时引用的内联css属性。
~~与触发事件相关的属性:
onblur:指定生成的HTML组件失去焦点时触发的事件。
onchange:指定生成的HTML组件内容改变时触发的事件。
onclick:指定生成的HTML组件被单击时触发的事件。
ondbclick:指定生成的HTML组件被双击时触发的事件。
onfocus:指定生成的HTML组件获得焦点时触发的事件。
onkeydown:指定在生成的HTML组件中按下键盘时触发的事件。
onkeypress:指定在生成的HTML组件中按下并释放键盘时触发的事件。
onkeyup:指定在生成的HTML组件中释放键盘时触发的事件。
onmousedown:指定在生成的HTML组件中按下鼠标时触发的事件。
onmousemove:指定在生成的HTML组件中鼠标移动时触发的事件。
onmouseout:指定鼠标移动出生成的HTML组件时触发的事件。
onmouseover:指定鼠标移动入生成的HTML组件时触发的事件。
onmouseup:指定释放鼠标按键时触发的事件。
onselect:指定生成的HTML组件中选中区域改变时触发的事件。
~~与悬浮提示相关的属性:
jsTooltipEnabled:是否允许用JavaScript来生成悬浮提示。
tooltip:悬浮提示的内容。
tootipDelay:悬浮提示出现的延迟时间,以毫秒为单位。
tooltipIcon:悬浮提示使用的图标的URL路径。
~~其他来源于html的属性:
accesskey:指定快捷键,如果设置这个属性为x,按Alt+x就可以快速定位到这个生成的HTML组件。
disabled:生成的HTML组件是否可用。
id:指定生成的HTML组件的id。
tabindex:指定生成的HTML组件的tab顺序的索引。
title:指定生成的HTML组件的标题信息。
~~与提示文本相关的属性:
label:用来显示在HTML组件前的文本。
key:同label一样,也是用来显示在HTML组件前的文本,但是其内容取自国际化信息。
labelposition:标签文本显示的位置,可以选择top或left。
~~与模板和主题相关的属性:
template:指定使用的模板。
templateDir:指定使用的模板所在的目录。
theme:指定使用的主题。
~~与是否为必填项相关的属性:
required:指定此生成的HTML组件是否为必填项。
requiredposition:指定此生成的HTML组件是必填项时提示信息显示的位置,可以选择left或right。
4.接下来分别对一些常用的表单标签进行介绍:
(1).form标签:form(表单)标签是所有UI组件中最特别的一个,其它的UI组件要与服务器交互数据,必须放在这个标签内。这个标签也是在编写服务器端应用的时候最常用的一个标签,几乎所有的交互页面都可以看见它的影子。
form标签的属性如下表所示:
名称 | 是否必需 | 默认值 | 类型 | 说明 |
---|---|---|---|---|
action | 否 | 当前的action | String | 指定提交的action的名字,不要添加.action后缀 |
namespace | 否 | 当前的命名空间 | String | 指定提交的action所属的名称空间 |
method | 否 | post | String | HTML表单的method属性,取值为get或post |
enctype | 否 | 无 | String | 上传文件时,设为multipart/form-data |
focusElement | 否 | 无 | String | 指定某个表单元素的id,当页面加载时,该元素具有焦点 |
validate | 否 | 无 | Boolean | 是否执行客户端验证,只有使用xhtml主题或ajax主题时才有效 |
(2).单行文本框textfield标签:单行文本框是表单域中最常见,textfield标签对应着HTML的<input type="text"/>,用于生成单行文本。
除了上面列出的各种常见通用属性,textfield标签还有几个其它的属性:
名称 | 是否必需 | 默认值 | 类型 | 说明 |
---|---|---|---|---|
maxlength | 否 | 无 | Integer | 文本输入控件可以输入字符的最大长度 |
readonly | 否 | false | Boolean | 当该属性的值为true时,用户不能在文本控件中输入文本 |
size | 否 | 无 | Integer | 指定文本输入控件的可视尺寸 |
(3).password标签:即密码框,用来输入一段单行文本,但是不会明文显示,而是用掩码代替。password标签对应<input type="password"/>。
除了上面列出的各种常见通用属性,password标签还有几个其它的属性:
名称 | 是否必需 | 默认值 | 类型 | 说明 |
---|---|---|---|---|
maxlength | 否 | 无 | Integer | 口令输入控件可以输入字符的最大长度 |
readonly | 否 | false | Boolean | 当该属性的值为true时, 用户不能在口令控件中输入文本 |
size | 否 | 无 | Integer | 指定口令输入控件的可视尺寸 |
showPassword | 否 | false | Boolean | 是否显示密码,当为true时,密码被显示。除非特殊需求,否则不要将该属性设为true |
(4)submit标签:submit标签输出一个提交按钮。submit标签和form标签一起使用可以提供异步表单提交功能,submit标签可以输出以下三种类型提交按钮:
input:等价于:<input type="submit"/>
image:等价于:<input type="image"/>
button:等价于:<input type="button"/>
除了上面列出的各种常见通用属性,submit标签还有几个其它的属性:
名称 | 是否必需 | 默认值 | 类型 | 说明 |
---|---|---|---|---|
type | 否 | input | String | 要使用的提交按钮的类型,有效值为:input、button、image |
src | 否 | 无 | String | 为image类型的提交按钮设置图片地址,该属性对input和button类型的提交按钮无效 |
action | 否 | 无 | String | 指定处理提交请求的action |
method | 否 | 无 | String | 指定处理提交请求的action的方法 |
(5).select标签:用来输出一个html列表框,等价于:<select><option></option></select>。
除了上面列出的各种常见通用属性,select标签还有几个其它的属性:
名称 | 是否必需 | 默认值 | 类型 | 说明 |
---|---|---|---|---|
list | 是 | 无 | Collection、Map、Enumeration、Iterator、array | 要迭代的集合,使用集合中的元素来设置各个选项,如果list的属性为Map的话,则Map的key成为选项的value,Map的value会成为选项的内容 |
listKey | 否 | 无 | String | 指定集合对象中的哪个属性作为选项的value |
listValue | 否 | 无 | String | 指定集合对象中的哪个属性作为选项的内容 |
headerKey | 否 | 无 | String | 设置当用户选择了header选项时,提交的value,如果使用该属性,不能为该属性设置空值 |
headerValue | 否 | 无 | String | 显示在页面中header选项的内容 |
emptyOption | 否 | false | Boolean | 是否在header选项后面添加一个空选项 |
multiple size |
否 否 |
false 无 |
Boolean Integer |
是否多选 显示的选项个数 |
(6).optgroup标签:作为select的子标签,用来生成一组选项。一个下拉列表框中可以包含多个选项组,可以在一个<s:select>标签中使用多个<s:optgroup>标签。
optgroup标签的主要属性有:
~list:用于生成下拉框选项的集合。
~listKey:生成的选项的value属性。
~listValue:生成的选项显示的文字。
~label:用于生成选项组的文本。
(7).radio标签:用来生成一系列的单选框,用户只能选择其中的一个。Struts2的radio标签对应于HTML的<input type="radio"/>。
除了上面列出的各种常见通用属性,radio标签还有几个其它的属性:
~list:用于生成单选框的集合,必须配置。
~listKey:生成的radio的value属性。
~listValue:生成的radio后面显示的文字。
这三个属性一定要配合使用,由list属性指定从哪个集合中获得元素,由listKey属性指定获得元素之后使用元素的哪个属性作为生成的<input type="radio"/>的value属性,由listValue属性指定生成的<input type="radio"/>后的给用户看的文字。
(8).checkboxlist标签:复选框组用来生成一系列复选框,用户可以选择其中的零到多个,Struts2的checkboxlist标签用来生成一组<input type="check"/>。
这个标签和上面介绍的radio标签的属性极其类似,除上面列出常见通用属性,其主要属性有:
~list:用于生成复选框的集合。
~listKey:生成的checkbox的value属性。
~listValue:生成的checkbox后面显示的文字。
这三个属性的用法与radio标签的那三个属性相同。
(9).doubleselect标签:doubleselect标签是select标签的扩展,当有大量的选项要给用户做选择时,可以使用这个标签。例如需要用户先选择国家,再选择省份,再选择市等等更多选择时,可以使用doubleselect这个标签。其中和select不同的地方,doubleselect标签的第一个下拉框是一个分组的列表可以通过list属性来指定。通过使用JavaScript等方法,第二个下拉框会随着第一个下拉框的选择不同而不同。
doubleselect标签的属性为:
属性 | 数据类型 | 是否必须 | 描述 |
---|---|---|---|
list | Collection | 否 | 列出的内容,可以是表达式 |
listKey | String | 否 | 列表的Key的表达式 |
listValue | String | 否 | 列表value的表达式 |
doubleList | Collection | 否 | 用来对所有列表列表项求值的表达式 |
doubleListKey | String | 否 | 列表的Key的表达式 |
doubleListValue | String | 否 | 列表value的表达式 |
doubleName | String | 否 | 用来映射到第二个下拉框的表单的名字 |
doubleValue | Object | 否 | 第二个下拉框的表单元素的值 |
headerKey | String | 否 | 如果选择header仅提交第一个下拉框 |
headerValue | String | 否 | 用户看到的header选项的内容,仅对第一个适用 |
emptyOption | Boolean | 否 | 表格和内容之间是否置空格,对第一个下拉框 |
multiple | Boolean | 否 | 设为TRUE就允许用户选择多个值 |
size | String | 否 | 设定下拉框的长度 |
名称 | 必须 | 默认值 | 类型 | 描述 |
---|---|---|---|---|
list | 是 | 无 | Collection、Map、Enumeration、Iterator、array | 要迭代的集合,使用集合中的元素来设置各个选项,如果list的属性为Map的话,则Map的key成为选项的value,Map的value会成为选项的内容 |
listKey | 否 | 无 | String | 指定集合对象中的哪个属性作为选项的value |
listValue | 否 | 无 | String | 指定集合对象中的哪个属性作为选项的内容 |
headerKey | 否 | 无 | String | 设置当用户选择了header选项时,提交的value,如果使用该属性,不能为该属性设置空值 |
headerValue | 否 | 无 | String | 显示在页面中header选项的内容 |
emptyOption | 否 | false | Boolean | 是否在header选项后面添加一个空选项 |
multiple | 否 | false | Boolean | 是否多选 |
size | 否 | 无 | Integer | 显示的选项个数 |
moveUpLabel | 否 | String | 设置向上移动按钮上的文本 | |
moveDownLabel | 否 | String | 设置向下移动按钮上的文本 | |
selectAllLabel | 否 | String | 设置向全部选择按钮上的文本 | |
allowMoveUp | 否 | 无 | Boolean | 设置是否使用向上移动按钮 |
allowMoveDown | 否 | 无 | Boolean | 设置是否使用向下移动按钮 |
allowSelectAll | 否 | 无 | Boolean | 设置是否使用全部选择按钮 |
~~控制左下拉框名字以及数据来源:
name:左下拉框的name属性。
list:用于生成左下拉框的集合。
listKey:生成左下拉框的选项的value属性。
listValue:生成左下拉框的选项显示的文字。
headerKey:在左下拉框所有的选项前再额外加一个选项作为其标题,headerKy设置的是标题的value属性。
headerValue:在左下拉框所有的选项前再额外加一个选项作为其标题,headerValue设置得是标题的显示文字。
~~控制右下拉框名字以及数据来源:
doubleName:右下拉框的name属性。
doubleList:用于生成右下拉框的集合。
doubleListKey:生成右下拉框的选项的value属性。
doubleListValue:生成右下拉框的选项显示的文字。
doubleHeaderKey:在右下拉框所有的选项前再额外加一个选项作为其标题,headerKy设置的是标题的value属性。
doubleHeaderValue:在右下拉框所有的选项前再额外加一个选项作为其标题,headerValue设置得是标题的显示文字。
~~控制两个下拉框之间的左右移按钮:
allowAddAllToLeft:指定是否出现“全部移到左边”按钮。
allowAddToLeft:指定是否出现“移到左边”按钮。
allowAddToRight:指定是否出现“移到右边”按钮。
allowAddAllToRight:指定是否出现“全部移到右边”按钮。
addAllToLeftLabel:指定“全部移到左边”按钮上显示的文本。
addAllToRightLabel:指定“全部移到右边”按钮上显示的文本。
addToLeftLabel:指定“移到左边”按钮的上的文本。
addToRightLabel:指定“移到右边”按钮的上的文本。
~~控制两个下拉框分别的上下移按钮。
allowUpDownOnLeft:指定左边下拉框是否出现上下移按钮。
allowUpDownOnRight:指定右边下拉框是否出现上下移按钮。
leftUpLabel:指定左边下拉框上移按钮上显示的文本。
leftDownLabel:指定左边下拉框下移按钮上显示的文本。
rightUpLabel:指定右边下拉框上移按钮上显示的文本。
rightDownLabel:指定右边下拉框下移按钮上显示的文本。
allowSelectAll:指定两个下拉框是否显示选中全部按钮。