我有一种情况,用户只能选择 7 天的日期范围。
所以如果开始日期是01-02-2016 00:00
最大结束日期应该是06-02-2016 23:59
那么如果用户选择08-02-2016 00:00
最大结束日期应该是14-02-2016 23:59
所以为此我使用日期时间选择器:http ://eonasdan.github.io/bootstrap-datetimepicker/#linked-pickers
我遇到的问题是,当我执行第一个条件时它工作正常 - 但是当我选择第二个条件时,它在控制台中出现错误。
这是我的代码:
$(function() {
$('#HistoryStartDate').datetimepicker({
format: 'DD/MM/YYYY HH:mm',
allowInputToggle: true,
useCurrent: true
}).on('dp.change', function(e) {
$('#HistoryEndDate').data('DateTimePicker').minDate(e.date);
var m = moment(new Date(e.date));
m.add(6, 'days');
$('#HistoryEndDate').data('DateTimePicker').maxDate(m);
});
$('#HistoryEndDate').datetimepicker({
format: 'DD/MM/YYYY HH:mm',
allowInputToggle: true,
useCurrent: true
});
});
这是 JSFiddle:https ://jsfiddle.net/xsmsym3m/
编辑:
我找到了一个似乎不是一个好的解决方案的解决方法,因为它在某些情况下会失败,但我将它发布在这里(https://jsfiddle.net/v18gfo4s/):
$(function() {
$('#HistoryStartDate').datetimepicker({
format: 'DD/MM/YYYY HH:mm',
allowInputToggle: true,
useCurrent: true
}).on('dp.change', function(e) {
// Adding two years so I can set the Min Date
var tt = moment(new Date(e.date));
tt.add(2, 'years');
$('#HistoryEndDate').data('DateTimePicker').maxDate(tt);
// Set the Min date
$('#HistoryEndDate').data('DateTimePicker').minDate(e.date);
//Set the Max Date
var m = moment(new Date(e.date));
m.add(5, 'days');
m.add(23, 'hours');
m.add(59, 'minutes');
m.add(59, 'seconds');
$('#HistoryEndDate').data('DateTimePicker').maxDate(m);
// Set End Date
var temp = moment(new Date(e.date));
temp.add(23, 'hours');
temp.add(59, 'minutes');
temp.add(59, 'seconds');
$('#HistoryEndDate').data('DateTimePicker').date(temp);
});
$('#HistoryEndDate').datetimepicker({
format: 'DD/MM/YYYY HH:mm',
allowInputToggle: true,
useCurrent: false
});
});