У меня есть ситуация, когда Пользователь может выбирать только диапазон дат 7 дней.Eonasdan Bootstrap Linked DateTime Pickers не работает должным образом
Так что, если дата начала 01-02-2016 00:00
Максимальная дата окончания должна быть 06-02-2016 23:59
Затем, если пользователь выбирает 08-02-2016 00:00
с Максимальная дата окончания должна быть 14-02-2016 23:59
Так для этого я использую Дата Время Picker: 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/
EDIT:
Я нашел обходной путь, который не кажется, как хорошее решение, потому что оно не сработает в некоторых сценариях, но я отправляю его здесь ():
$(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
});
});
К сожалению, это мое недоразумение. Но что вы подразумеваете в том, что «не похоже на хорошее решение». Вы хотите минимизировать код? –
@ManhLe Я имею в виду, что это обходное решение - добавление 2-х лет для установки Min date не должно быть решением. –