【发布时间】:2016-03-07 00:26:07
【问题描述】:
我有一种情况,用户只能选择 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
});
});
【问题讨论】:
-
对不起,这是我的误会。但是你对
not seem like a good solution是什么意思。你想最小化代码吗? -
@ManhLe 我的意思是这是一种解决方法 - 添加 2 年来设置最小日期不应该是一个解决方案。
标签: jquery twitter-bootstrap eonasdan-datetimepicker