Неактивный daterangepicker с использованием minDate и maxDate - PullRequest
0 голосов
/ 17 июня 2020

У меня есть 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>&nbsp;
                <input type="text" class="form-control" id="from" placeholder="Enter start date" name="from">&nbsp;&nbsp;
                <label for="to">To:</label>&nbsp;
                <input type="text" class="form-control" id="to" placeholder="Enter end date" name="to">&nbsp;&nbsp;
            <button type='button' id="date-submit-btn" class="btn btn-primary">Submit</button>
            </form>
...