先来看一下日期控件

  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>