datetimepicker
1, Struts2里的datetimepicker(注意与JAAS的冲突)
把struts2-dojo-plugin-xxx.jar放到WEB-INF/lib下
<%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
<sx:head/> //parseContent="true",
<s:form action="dateAction">
<sx:datetimepicker name="startdate" label="myDate" displayFormat="yyyy-MM-dd" value="%{'today'}"/>
<s:submit value="submit"></s:submit>
</s:form>
生成java.util.Date类的startdate的属性,在dateAction中设置该属性的setter和getter,来获得该属性,并进而传递到目的jsp中。
onchange不触发的问题
There are 2 steps involved in registering an event listener with the widget.
1.Call the dojo.addOnLoad() function.
2.Register your callback function to fire on the onValueChanged event.
<script type="text/javascript">
function initDatetimePicker() {
var datepicker = dojo.widget.byId("enddate");
dojo.event.connect(datepicker, "onValueChanged", myCallback );
}
function myCallback(){
var sdt = dojo.widget.byId("startdate").getValue();
var edt = dojo.widget.byId("enddate").getValue();
if(sdt>edt){
dojo.widget.byId("enddate").setValue(sdt);
}
}
dojo.addOnLoad(initDatetimePicker);
</script>
<s:form theme="simple" action="someAction">
<sx:datetimepicker name="startdate" id="startdate" label="startDate"
displayFormat="yyyy-MM-dd" value="%{'today'}"/>
<sx:datetimepicker name="enddate" id="enddate" label="endDate"
displayFormat="yyyy-MM-dd" value="%{'today'}"/>
<s:submit value="subbbb"/>
</s:form>
注意:
To access the the date selected by the user in your callback function you simply call the getDate() function on the datetimepicker widget:
var date = dojo.widget.byId("datepicker").getDate();
在实际测试中
var sdt = dojo.widget.byId("startdate").getValue();
dojo.widget.byId("enddate").setValue(sdt);
就可以实现赋值和取值了。
2, jQuery的Datepicker
详细内容:http://docs.jquery.com/UI/Datepicker#option-navigationAsDateFormat
//直接在网页上显示一个Datepicker,或者通过点选文本框或按钮来显示Datepicker,具有相关联ID的组件都是<input type="text" id="myDatepicker"/>,
而用$("#myDatepicker").datepicker({
showOn: 'button',//或者 'focus'或'both',默认值是'focus'
buttonText: 'Calendar'
});
即其中的showOn类型来决定是点选文本框还是按钮来显示Datepicker。并且这个文本框会自动与Datepicker关联。
而要另外关联点击内容显示的话,通过altField属性来设置。
例:
<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
//通过焦点进入文本框datepicker1出现Datepicker,点击Datepicker结果显示在本文本框,Datepicker自动消失
<script type="text/javascript">
$(document).ready(function() {
$("#myDatepicker").datepicker();
});
</script>
</head>
...
<input type="text" id="myDatepicker"/>
...
//在创建Datepicker的时候设置多个属性
$("#datepicker2").datepicker({
showOn: 'button', //非末属性后加,分开
buttonText: 'Calendar' //末属性后不用加,
});
//Datepicker的属性的设定
$.datepicker.setDefaults();好像不起作用。
//通过.datepicker('option',...,...);来设置,必须先init datepicker才能再设置datepicker的option
//代表设置datepicker的...的属性值为...,但不执行创建datepicker();
$("#datepicker").datepicker('option',...,...);