Home > Mobile >  How clear/reset the DateRangePicker calendar?
How clear/reset the DateRangePicker calendar?

Time:08-13

I have JQuery plugin DateRangePicker calendar and reset button. How i can clear/reset selected dates in DateRangePicker calendar?

/* Calendar init */ 
$('.calendar__input').daterangepicker({
        alwaysShowCalendars: true, 
        linkedCalendars: false, 
        showDropdowns: true, 
        autoApply: true, 
        parentEl: $('.calendar__body'), 
        minDate: new Date(), 
        maxYear: parseInt(moment().add(5, "years").format('YYYY')), 
        locale: {
            firstDay: 1,
            format: 'DD.MM.YYYY',
            daysOfWeek: [
                "Вс",
                "Пн",
                "Вт",
                "Ср",
                "Чт",
                "Пт",
                "Сб"
            ],
            monthNames: [
                "Январь",
                "Февраль",
                "Март",
                "Апрель",
                "Май",
                "Июнь",
                "Июль",
                "Август",
                "Сентябрь",
                "Октябрь",
                "Ноябрь",
                "Декабрь"
            ],
        }
    });
    
    /* Reset Calendar */
    $('.reset').click(function () { 
        $('.calendar__input').val('');
    });

CodePen: https://codepen.io/maxbeat/pen/WNzgaMJ

CodePudding user response:

set global var var today = new Date();

in the reset button put:

$('.calendar__input').data('daterangepicker').setStartDate(today); $('.calendar__input').data('daterangepicker').setEndDate(today); $('.calendar__input').data('daterangepicker').updateCalendars();

This will set the new dates but you will need to updateCalendars after that.

  • Related