struts2学习笔记之表单标签的详解:s:checkbox/radio/select/optiontransferselect/doubleselect/combobox
struts2中的表单标签都是以s标签的方式定义的，同时，struts2为所有标签都提供了一个模板，C:\Users\180172\Desktop\struts2-core-2.2.1.1.jar\template\中的三个文件夹共同提供模板。struts2中模板的制作使用了freemark技术
主题:如果为所有的标签都提供了模板，这系列的模板就组成了主题。所有的主题都放在template文件夹下（默认情况下）
struts2 默认提供了3个主题：
simple ----没有额外的附加行为的主题，只生成最核心的html元素，其他附加的东西，比如两列布局，label等都没有
xhtml --1.struts2 的默认主题 ，默认主题通过strus.ui.theme常量修改
2.生成label
3.输出错误提示
4.客户端校验支持
css_xhtml. --在xhtml增加了一些css样式，用的较少如果有需要，我们也可以针对自己的项目自定义开发主题（freemark）
如何设置主题：
1。可直接通过struts.ui.theme来设置默认主题
2.通过page/request/session/application设置主题
3.为标签设置theme属性，子标签默认使用父标签的theme属性，为子标签设定theme属性，将覆盖父标签theme属性
---表单标签：
checkbox 复选框
head 引入一些辅助的css样式单和js脚本
file 生成一个文件上传域
form
hidden
label
password
reset
submit
textarea 多行文本框
textfield 单行文本框
复杂的
checkbox/radio/select/optgroup
combobox 生成一个文本框以列表框的组合这几个标签其属性大体一致，以下是具体实例代码
--> <script> function check(){ var xianshi=""; var a=document.form1.fdsfs; alert(a.length); for(var i=0;i<a.length;i++){ if(a[i].checked==true){ xianshi=xianshi+a[i].value; } } document.getElementById("xuelia").value=xianshi; } </script> </head> <body> <s:action var="xuelis" name="xuelis" namespace="/"/> <s:form name="form1"> <s:select label="学历选择" name="af" list="#xuelis.xueli" listKey="id" listValue="name"> <s:optgroup label="学历二次选择" list="#xuelis.xueli" listKey="id" listValue="name"/> </s:select> <%-- <tr> <td class="tdLabel"><label for="select_af" class="label">学历选择:</label></td> <td ><select name="af" id="select_af"> <option value="1">大专</option> <option value="2">本科</option> <option value="3">硕士</option> <option value="4">博士</option> </select> --%>
<s:set var="renwu" value="#{'西游记':{'孙悟空','猪八戒','沙僧'},'水浒':{'武松','林冲','鲁智深'},'三国演义':{'刘备','张飞','关羽'} }"/>
<s:doubleselect name="book" list="{'西游记','水浒'}"
doubleList="top=='西游记'?{'孙悟空','猪八戒','沙僧'}:{'林冲','武松'}" doubleName="waha" label="选择喜欢的人物"/>
<s:doubleselect name="renwus" list="#renwu.keySet()" doubleList="#renwu[top]" doubleName="renwua" label="选择喜欢的人物"/>
<s:radio label="degree" name="shabi" list="#xuelis.xueli" listKey="id" listValue="name" /> <!-- <tr> <td class="tdLabel"><label for="select_shabi" class="label">degree:</label></td> <td > <input type="radio" name="shabi" id="select_shabi1" value="1"/><label for="select_shabi1">大专</label> <input type="radio" name="shabi" id="select_shabi2" value="2"/><label for="select_shabi2">本科</label> <input type="radio" name="shabi" id="select_shabi3" value="3"/><label for="select_shabi3">硕士</label> <input type="radio" name="shabi" id="select_shabi4" value="4"/><label for="select_shabi4">博士</label> </td> </tr> --> <s:textfield name="xuelia" id="xuelia"/> <s:checkboxlist label="学历 " name="fdsfs" list="#xuelis.xueli" listKey="name" listValue="name" onclick="check()" /> <!-- <tr> <td class="tdLabel"></td> <td ><input type="text" name="xuelia" value="" id="xuelia"/></td> </tr> <tr> <td class="tdLabel"><label for="select_fdsfs" class="label">学历 :</label></td> <td > <input type="checkbox" name="fdsfs" value="大专" id="fdsfs-1" onclick="check()"/> <label for="fdsfs-1" class="checkboxLabel">大专</label> <input type="checkbox" name="fdsfs" value="本科" id="fdsfs-2" onclick="check()"/> <label for="fdsfs-2" class="checkboxLabel">本科</label> <input type="checkbox" name="fdsfs" value="硕士" id="fdsfs-3" onclick="check()"/> <label for="fdsfs-3" class="checkboxLabel">硕士</label> <input type="checkbox" name="fdsfs" value="博士" id="fdsfs-4" onclick="check()"/> <label for="fdsfs-4" class="checkboxLabel">博士</label> <input type="hidden" id="__multiselect_select_fdsfs" name="__multiselect_fdsfs" value="" /> </td> </tr> --> <s:combobox label="请选择图书" name="book" list="#xuelis.xueli" listKey="id" listValue="name" /> <%-- <tr> <td class="tdLabel"><label for="select_book" class="label">请选择图书:</label></td> <td > <script type="text/javascript"> function autoPopulate_select_book(targetElement) { targetElement.form.elements['book'].value=targetElement.options[targetElement.selectedIndex].value; } </script> <input type="text" name="book" value="" id="select_book"/><br /> <select onChange="autoPopulate_select_book(this);"> <option value="1">大专</option> <option value="2">本科</option> <option value="3">硕士</option> <option value="4">博士</option> </select> </td> </tr> --%> </s:form> <input type="checkbox" name="a" id="b" value="nima" onclick="check()">a <input type="checkbox" name="a" id="b" value="hehe" onclick="check()">g <input type="checkbox" name="a" id="b" value="shit" onclick="check()">h <input type="checkbox" name="a" id="b" value="haha" onclick="check()">j
效果如图所示：
