miniUI日历控件只可以选择当前之前日期

来源:互联网 发布:淘宝新开店铺旺旺采集 编辑:程序博客网 时间:2024/06/05 21:13

这个也是项目中遇到的一个,因为分两个系统,一个系统用的easyUI,这个系统用的miniUI,
需求描述:该检索条件中的日历控件,只可以选择当前之前的任意一天,以后的日期不可以选择。
检索条件代码如下:

<td align="right">出生日期</td>                    <td >                        <input id="csksrq" name="csksrq" size="15" format="yyyy-MM-dd"  class="mini-datepicker" style='width: 100px;' ondrawdate="onDrawDate"><input  id="csjsrq" name="csjsrq" size="15" format="yyyy-MM-dd" class="mini-datepicker" style='width: 100px;' ondrawdate="onDrawDate">                    </td>

上面的代码是miniUI里面的,使用的是miniUI的datepicker,只需要添加这段代码:

ondrawdate="onDrawDate"

在JS中实现onDrawDate函数,实现如下:

function onDrawDate(e) {        var date = e.date;        var d = new Date();        if (date.getTime() > d.getTime()) {            e.allowSelect = false;        }    }

将日历控件时间和当前的时间做比较,如果当前时间小于日期控件的时间,就将allowSelect设置为false,该日期则不可以被选择。
实现的效果图如下:
这里写图片描述

0 0
原创粉丝点击