my97显示双日历(向前一个月不是向后一个月)

关键问题是向前一个月不是向后一个月

我的页面首先有2个文本框,一个开始日期,一个结束日期

<input type=“text” id=“startTime” placeholder=“起始日期”/> - 
<input type=“text” id=“endTime” placeholder=“结束日期”/>

首先去 my97 官网下载控件,引用的时候最需要引用一个主文件即可,其他样式,图片等都不需考虑,脚本内部做了引用.

<script type=”text/javascript” src=”/DatePicker/WdatePicker.js”></script>

然后给 开始日期  结束日期 俩个文本框绑定DatePicker脚本.

$(“#startTime”).bind(“click”,function(){
             WdatePicker({});
         });
         $(“#endTime”).bind(“click”,function(){
             WdatePicker({});
         });

OK,就是这样,俩个日历控件就轻松绑定了,但是我们上面提到的需求远远不满足,我们一个一个分析.

首先:我需要现实日历格式是 yyyy-MM-dd ,对应配置 WdatePicker({dateFmt:’yyyy-MM-dd’})

我需要日历默认从上个月显示  WdatePicker({dateFmt:’yyyy-MM-dd’,startDate:’%y-{%M-1}-%d’})

我需要日历现实双月份   WdatePicker({dateFmt:’yyyy-MM-dd’,startDate:’%y-{%M-1}-%d’,doubleCalendar:true})  这样日历默认显示上个月和本月.

我需要开始日期不能大于结束日期 WdatePicker({dateFmt:’yyyy-MM-dd’,startDate:’%y-{%M-1}-%d’,doubleCalendar:true,maxDate:’#F{$dp.$D(’endTime’)||’%y-%M-%d’}'})

这里详细看下maxDate 值:#F{$dp.$D(’endTime’)||’%y-%M-%d’  如果控件ID为  endTime 有值?那么起始日期值不能大于此值,如果没有值,则不能大于今天  ’%y-%M-%d’ 表示今天.

对于结束日期,则最小值不能小于起始日期 ,配置如下:  minDate:’#F{$dp.$D(’startTime’)}’   startTime 为起始日期文本框ID

最后我希望选择完开始日期后,自动弹出结束日期选择框  见配置项  onpicked:function(){endTime.click();}    这里的endTime 是结束日期文本框元素ID

最后这俩个文本框的click事件绑定如下:

$(function(){
         $(“#startTime”).bind(“click”,function(){
             WdatePicker({doubleCalendar:true,startDate:‘%y-{%M-1}-%d’,dateFmt:‘yyyy-MM-dd’,autoPickDate:true,maxDate:‘#F{$dp.$D(’endTime’)||’%y-%M-%d’}’,onpicked:function(){endTime.click();}});
         });
         $(“#endTime”).bind(“click”,function(){
             WdatePicker({doubleCalendar:true,startDate:‘%y-{%M-1}-%d’,minDate:‘#F{$dp.$D(’startTime’)}’,maxDate:‘%y-%M-%d’,dateFmt:‘yyyy-MM-dd’,autoPickDate:true});
         });
});