У меня есть 2 формы на моей веб-странице (Form1 и Form2). Form1 имеет несколько опций, каждая опция связана с диапазоном дат. Form2 имеет 2 поля ввода даты. При выборе параметра из формы Form1 активируется вторая форма с диапазоном дат параметра, выбранным в форме Form1. Я использую параметр minDate и maxDate в DateRangePicker. Проблема: изначально все даты отключены, но как только вы щелкнете другой месяц, он активируется.
код для DateRangePicker
function init_calender(startY, endY) {
console.log("in new init_cal", startY, endY);
$('input[name="from"]').daterangepicker({
locale: {
format: 'YYYY-MM-DD'
},
// dateFormat: 'YYYY-MM-DD',
autoUpdateInput: false,
singleDatePicker: true,
showDropdowns: true,
minDate: startY,
maxDate: endY
});
$('input[name="from"]').on('apply.daterangepicker', function (ev, picker) {
$(this).val(picker.startDate.format('DD/MM/YYYY'));
});
$('input[name="from"]').on('cancel.daterangepicker', function (ev, picker) {
$(this).val('');
});
$('input[name="to"]').daterangepicker({
locale: {
format: 'YYYY-MM-DD'
},
autoUpdateInput: false,
singleDatePicker: true,
showDropdowns: true,
minDate: startY,
maxDate: endY
// maxYear: parseInt(moment().format('YYYY'), 10)
});
$('input[name="to"]').on('apply.daterangepicker', function (ev, picker) {
$(this).val(picker.startDate.format('DD/MM/YYYY'));
});
$('input[name="to"]').on('cancel.daterangepicker', function (ev, picker) {
$(this).val('');
});
}
HTML код формы 2
<form class="form-inline hide" id="analysis-form">
<label for="from">From:</label>
<input type="text" class="form-control" id="from" placeholder="Enter start date" name="from">
<label for="to">To:</label>
<input type="text" class="form-control" id="to" placeholder="Enter end date" name="to">
<button type='button' id="date-submit-btn" class="btn btn-primary">Submit</button>
</form>