关于easyui-datebox日期最大默认值和起止日期验证的问题

起止日期验证:

首先自定义验证规则:

endDate: {
          validator: function (value, param) {
              var start = $(param[0]).datetimebox('getValue');
              return value >= start;    
          },
          message: '结束日期应大于等于开始日期!'
      }

在页面引用自定义的验证规则:

~

data-options中validType使用我们定义的验证规则endDate,传入参数开始日期标签id。



日期最大默认值:

设置日期最大默认值需要修改源码,jquery.datebox.js和jquery.calendar.js。

打开jquery.datebox.js,找到

/**
 * if the calendar isn't created, create it.
 */
为calendar添加endDate属性,

$.extend(state.calendar.calendar('options'), {
				fit: true,
				border: false,
				endDate:opts.endDate,
				onSelect: function(date) {
					var target = this.target;
					var opts = $(target).datebox('options');
					setValue(target, opts.formatter.call(target, date));
					$(target).combo('hidePanel');
					opts.onSelect.call(target, date);
				}
			});


接着打开jquery.calendar.js,找到show方法,在循环设置日期中添加如下代码:

if (!opts.validator.call(target, dvalue)){
					cls += ' calendar-disabled';
				}
				//设置最大选择时间(默认为当前时间),超过最大选择时间不可选
				if(!opts.endDate){
					opts.endDate = compareNow;
				}
				var endTmp = opts.endDate.split('-');
			    if((day[0] > endTmp[0]) || (day[0] == endTmp[0] && day[1]>endTmp[1]) || 
			    		(day[0]==endTmp[0] && day[1]==endTmp[1] && day[2]>endTmp[2])){
			    	cls += ' calendar-disabled';
			    }
			    /////

其中的compareNow为循环外设置的当前日期:

var compareNow = now.getFullYear()+'-'+(now.getMonth()+1)+'-'+now.getDate();

如果要手动设置最大可选日期的话,在标签中加入data-options的endDate值。


到此,关于easyui-datebox日期最大默认值和起止日期验证的问题就解决了。(还是97Date好用些吧。。)

你可能感兴趣的:(关于easyui-datebox日期最大默认值和起止日期验证的问题)