您的位置:首页 > 产品设计 > UI/UE

EasyUi 日历组件 datebox 开始时间与结束时间限制

2015-07-31 12:00 537 查看
说明:只有选了开始日期才能选择结束日期,当选择了结束日期又重新选择了开始日期,则需要重新选择结束日期。
<input id="startdate" 	class="easyui-datebox" name="startdate" data-options="prompt:'请选择开始日期',editable:false,required:'true',onSelect:onSelect">
<input id="enddate"	class="easyui-datebox" name="enddate"   data-options="prompt:'请选择结束日期',editable:false,required:'true',disabled:true,validType:'equaldDate[\'#startdate\']'">


 <script>
function onSelect(date){  //开始日期选择时触发
$('#enddate').datebox('enable');	//启用结束日期控件
$('#enddate').datebox('reset')		//重置结束日期的值
};
$.extend($.fn.validatebox.defaults.rules, {
equaldDate: {
validator: function(value, param){
var d1 = $(param[0]).datetimebox('getValue');  //获取开始时间
return value >=d1;  //有效范围为大于开始时间的日期
},
message: '结束日期不能早于开始日期!'
}
})
</script>


 

 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  easyui datebox js