WdatePicker日历控件使用

<input type="text" id="start_Time" size="10" value="2014-11-12" class="Wdate"

onfocus="WdatePicker({minDate:'2014.11.1',onclearing:pickedFunc,readOnly:true})"/>

<input type="text" id="end_Time"

onfocus="WdatePicker({minDate:'#F{$dp.$D(\'start_Time\')||\'2010-10-01\'}',onpicked:pickedFunc,isShowClear:false})"

显示效果:

WdatePicker日历控件使用

设置class="Wdate"即可以出现右侧的日历图标

设置日期的可选范围:

minDate:'2014.1.1'

maxDate:'2014.4.1'

还可以将其它的控件的值做为最大最小值,比如上面的

minDate:'#F{$dp.$D(\'start_Time\')||\'2010-10-01\'}' 即将start_Time控件的值最为最小值,当start_Time没有设定值时,将使用2010-10-01的值

将最大日期设为当前日期: maxDate:'%y-%M-%d'

将最大日期设为当前日期前3天 maxDate:'%y-%M-{%d-3}'

设置皮肤:skin:'whyGreen'

有两种皮肤,

默认为default,

个人比较喜欢浅绿色的whyGreen

当然也可以自定义比较简单,请看官网

可以在选定日期后进行一些处理,可以使用onpicked:pickedFunc,pickedFunc为js函数

可以控件日期是否可以手动修改

readOnly:true 只读

可以设置是否显示清空,今天,确定等按钮:

isShowClear:true

isShowToday:true,

isShowOK:true,

其它详见官网

官网下载:

秒客网