先来看一下日期控件
html5标签中其实已经有日期的类型,用<input type="date">便可调用。
struts里面也自带了日期控件,其使用步骤为:
1. 导入其相关的jar包,我导的是struts2-dojo-plugin-2.2.1.1 ,然后在jsp中导入struts标签库。
<%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
2.使用标签
<sx:datetimepicker name="birthday"></sx:datetimepicker>
3.在head中定义其样式
<sx:head/>
最终效果: 但该插件有个bug,8月后会出现乱码。
所以用到日期插件时还有更好的选择,datapicker,用法更简单,下载好该插件,在script中导入即可
<script type="text/javascript" src="datepicker/WdatePicker.js"></script>
<input type="text" class="Wdate"/>
效果也是很不错的
再看一下struts中自带的表单标签,它自带了样式和效果,如果不想用它的样式,把标签的theme属性改为simple即可。
用它表单的标签好处在于像复选框之类的标签自带list属性,方便传一个list进去,该list可以用json从后台传过来,也可以直接在页面上用ognl表达式构造一个list。
在联系中我写了段ajax,用Struts自带的传json数据的方法,配置好action的xml文件从后台传了一个list过来,当然传json也可以直接导入json的jar包用JSONArray转换成json格式数据传过来,代码如下,action和xml配置文件就不粘了。
代码如下
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="sx" uri="/struts-dojo-tags" %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <sx:head/> <title>Insert title here</title> <script type="text/javascript" src="js/jquery-2.0.3.min.js"></script> <script type="text/javascript" src="datepicker/WdatePicker.js"></script> <script type="text/javascript"> $(function(){ $.get("/Struts/ognl",function(data){ for(var i=0;i<data.length;i++){ var optionstr='<option>'+data[i].username+'</option>'; $("#sel").append(optionstr); } },'json'); }); </script> </head> <body> <%-- 日期:<sx:datetimepicker name="birthday"></sx:datetimepicker> <hr> --%> 日期:<input type="text" class="Wdate" onclick="WdatePicker()"> <hr> <s:form action="ognl"> <s:textfield name="username" label="用户名"></s:textfield> <s:textfield name="password" label="密码"></s:textfield> <s:checkboxlist name="hobby" label="爱好" list="{'basketball','valleyball','ping-pang','swiming'}"></s:checkboxlist> <s:radio list="#{'1':'男','2':'女'}" name="sex" label="性别"></s:radio> <select id="sel"> </select> </s:form> <form action="upload" method="post" enctype="multipart/form-data">
<input type="file" name="upload"> <input type="submit" value="上传"> </form> </body>
</html>