在Struts2,dojo ajax标签“<sx:datetimepicker>”将呈现一个文本框和追加后面的日历图标,点击日历图标会提示的日期时间选择器组件。
这里创建一个Web工程:strut2datetimepicker,来演示在多个复选框如何设置的默认值,整个项目的结构如下图所示:
要创建一个日期时间接组成部分,确保:
1. 下载 struts2-dojo-plugin.jar 库(myeclipse中在增加struts2时,打上这个选项就可以了)
2. 包括“struts-dojo-tags”标签,并输出它的头。
<%@ taglib prefix="sx" uri="/struts-dojo-tags" %> <html> <head> <sx:head /> </head>
例如:
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
<html>
<head>
<sx:head />
</head>
<body>
<sx:datetimepicker name="date2" label="Format (dd-MMM-yyyy)"
displayFormat="dd-MMM-yyyy" value="%{'2010-01-01'}"/>
...
产生下面的HTML,一些Dojo和JavaScript库创建日期和时间接组件。
<html>
<head>
<script language="JavaScript" type="text/javascript">
// Dojo configuration
djConfig = {
isDebug: false,
bindEncoding: "UTF-8"
,baseRelativePath: "/Struts2Example/struts/dojo/"
,baseScriptUri: "/Struts2Example/struts/dojo/"
,parseWidgets : false
};
</script>
<script language="JavaScript" type="text/javascript"
src="/Struts2Example/struts/dojo/struts_dojo.js"></script>
<script language="JavaScript" type="text/javascript"
src="/Struts2Example/struts/ajax/dojoRequire.js"></script>
<link rel="stylesheet" href="/Struts2Example/struts/xhtml/styles.css" type="text/css"/>
<script language="JavaScript" src="/Struts2Example/struts/utils.js"
type="text/javascript"></script>
<script language="JavaScript" src="/Struts2Example/struts/xhtml/validation.js"
type="text/javascript"></script>
<script language="JavaScript" src="/Struts2Example/struts/css_xhtml/validation.js"
type="text/javascript"></script>
</head>
...
<td class="tdLabel">
<label for="widget_1291193434" class="label">Format (dd-MMM-yyyy):
</label></td>
<td>
<div dojoType="struts:StrutsDatePicker" id="widget_1291193434"
value="2010-01-01" name="date2" inputName="dojo.date2"
displayFormat="dd-MMM-yyyy" saveFormat="rfc"></div>
</td>
</tr>
<script language="JavaScript" type="text/javascript">
djConfig.searchIds.push("widget_1291193434");</script>
Struts2 <s:datetimepicker> 示例
在一个完整的全面<s:datetimepicker>标签例子来生成一个DateTimePicker控件,并展示了使用OGNL和Java属性的默认日期设置为“DateTimePicker”组件。
2. 动作类
Action类存储选择的日期。
DateTimePickerAction.java
package com.xuhuhu.common.action;
import java.util.Date;
import com.opensymphony.xwork2.ActionSupport;
public class DateTimePickerAction extends ActionSupport{
private Date date1;
private Date date2;
private Date date3;
//return today date
public Date getTodayDate(){
return new Date();
}
//getter and setter methods
public String execute() throws Exception{
return SUCCESS;
}
public String display() {
return NONE;
}
}
3. 结果页面
通过“<s:datetimepicker>”日期时间选择器组件标签渲染,通过Java属性和OGNL设置默认日期。
确保把“struts-dojo-tags”标签,并渲染到<sx:head />
<%@ taglib prefix="sx" uri="/struts-dojo-tags" %> <html> <head> <sx:head /> </head>
datetimepicker.jsp
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
<html>
<head>
<sx:head />
</head>
<body>
<h1>Struts 2 datetimepicker example</h1>
<s:form action="resultAction" namespace="/" method="POST" >
<sx:datetimepicker name="date1" label="Format (dd-MMM-yyyy)"
displayFormat="dd-MMM-yyyy" value="todayDate" />
<sx:datetimepicker name="date2" label="Format (dd-MMM-yyyy)"
displayFormat="dd-MMM-yyyy" value="%{'2010-01-01'}"/>
<sx:datetimepicker name="date3" label="Format (dd-MMM-yyyy)"
displayFormat="dd-MMM-yyyy" value="%{'today'}"/>
<s:submit value="submit" name="submit" />
</s:form>
</body>
</html>
result.jsp
<%@ taglib prefix="s" uri="/struts-tags" %> <html> <body> <h1>Struts 2 datetimepicker example</h1> <h2> Date1 : <s:property value="date1"/> </h2> <h2> Date 2 : <s:property value="date2"/> </h2> <h2> Date 3 : <s:property value="date3"/> </h2> </body> </html>
3. struts.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<constant name="struts.devMode" value="true" />
<package name="default" namespace="/" extends="struts-default">
<action name="dateTimePickerAction"
class="com.xuhuhu.common.action.DateTimePickerAction"
method="display">
<result name="none">/pages/datetimepicker.jsp</result>
</action>
<action name="resultAction"
class="com.xuhuhu.common.action.DateTimePickerAction" >
<result name="success">/pages/result.jsp</result>
</action>
</package>
</struts>
4. 示例
http://localhost:8080/strut2datetimepicker/dateTimePickerAction.action
注意:如果静态文件未找到,或是不能打日期选择,请下载代码并参考其中的web.xml配置。
参考
代码下载:http://pan.baidu.com/s/1c0ym4nu
