$('#minDate').daterangepicker({
"singleDatePicker": true,
"timePicker": true,
"timePicker12Hour": false,
"timePicker24Hour": true,
"startDate": new Date(),
"autoUpdateInput": false,
"autoApply": true,
"endDate": "06/29/2018"
}, function (start, end) {
//不要在这里给input框赋值,当用户使用我们给出的默认开始时间时,该回调不触发
});
//结束日期框点击的限制
$("#maxDate").click(function () {
console.log(11);
var start = $('#minDate').val();
if (!start || start.length == 0) {
alert(1);
return;
}
});
//开始日期选择按钮的点击事件监听
//即使用户没有选择时间,采用了默认的开始时间,也可以赋值
$('#minDate').on('apply.daterangepicker', function (ev, picker) {
console.log("apply:"+picker.startDate.format('YYYY-MM-DD HH:mm'));
//将选择的时间赋值给input
$('#minDate').val(picker.startDate.format('YYYY-MM-DD HH:mm'));
//初始化结束日期的空件
$('#maxDate').daterangepicker({
"singleDatePicker": true,
"timePicker": true,
"timePicker24Hour": true,
"startDate": ..,//根据用户选择的时间来选择初始化的开始时间
"autoUpdateInput": false,
"endDate": ..//根据用户选择的时间来选择初始化的结束时间
}, function (start, end, label) {
});
});
//结束日期的监听
$('#maxDate').on('apply.daterangepicker', function (ev, picker) {
console.log("apply:"+picker.startDate.format('YYYY-MM-DD HH:mm'));
$('#maxDate').val(picker.startDate.format('YYYY-MM-DD HH:mm'));
});
源文件里面只有设置startDate和endDate的方法,如果需要设置minDate和maxDate,则可以在源文件里面的450行左右的DateRangePicker.prototype = {**}加入如下两个方法:
setMinDate: function(minDate){
if (typeof minDate === 'string')
this.minDate = moment(minDate, this.locale.format);
if (typeof minDate === 'object')
this.minDate = moment(minDate);
if (!this.timePicker)
this.minDate = this.minDate.startOf('day');
if (this.timePicker && this.timePickerIncrement)
this.minDate.minute(Math.round(this.minDate.minute() / this.timePickerIncrement) * this.timePickerIncrement);
if (this.minDate && this.startDate.isBefore(this.minDate)) {
this.startDate = this.minDate.clone();
if (this.timePicker && this.timePickerIncrement)
this.startDate.minute(Math.round(this.startDate.minute() / this.timePickerIncrement) * this.timePickerIncrement);
}
if (!this.isShowing)
this.updateElement();
this.updateMonthsInView();
},
setMaxDate: function(maxDate){
if (typeof maxDate === 'string')
this.maxDate = moment(maxDate, this.locale.format);
if (typeof maxDate === 'object')
this.maxDate = moment(maxDate);
if (!this.timePicker)
this.maxDate = this.maxDate.startOf('day');
if (this.timePicker && this.timePickerIncrement)
this.maxDate.minute(Math.round(this.maxDate.minute() / this.timePickerIncrement) * this.timePickerIncrement);
if (this.maxDate && this.startDate.isAfter(this.maxDate)) {
this.startDate = this.maxDate.clone();
if (this.timePicker && this.timePickerIncrement)
this.startDate.minute(Math.floor(this.startDate.minute() / this.timePickerIncrement) * this.timePickerIncrement);
}
if (!this.isShowing)
this.updateElement();
this.updateMonthsInView();
}
使用方法:
$(selector).data('daterangepicker').setMinDate(日期);
$(selector).data('daterangepicker').setMaxDate(日期);