Displaying Start date less than End date - Datepicker

user_6494375 0
Viewed 2418

So, I was trying to display only the dates which are greater than the start date in the 'end date date-picker'. Here, my problem is - if the user selects some start date initially (say 27th September), the end date date-picker is showing dates greater than 27th September, fine. But if he changes the start date for some reason (say 27th September to 25th September), the end date date-picker is still showing the dates greater than the previous start date only (i.e, 25th and 26th are not being highlighted). Attached Screenshot1 and Screenshot2

Here is the required js:

$(document).ready(function() {
    var start = new Date();
    // var end = new Date();

    $("#s_dt").datepicker({
        startDate: start,
        daysOfWeekDisabled: [0, 6],
        autoclose: true,
    })
    $("#s_dt").on('changeDate', function() {
        var st = $(this).datepicker("getDate");
        var end = st;
        // end.setDate(st.getDate());
        console.log(st);
        end.toLocaleDateString();
        console.log(end);
        $('#e_dt').val('');            

        $("#e_dt").datepicker({
            startDate: end,
            daysOfWeekDisabled: [0, 6],
            autoclose: true,
        })

    })

})

Thanks in advance...

datepicker date datetime jquery javascript
1 Answers

datepicker has method setStartDatethat you can use to set start date of end date input whenever the start date is changed, instead of initialising it again.

$("#s_dt").datepicker({
    startDate: start,
    daysOfWeekDisabled: [0, 6],
    autoclose: true,
});

//initialize it once without start date
$("#e_dt").datepicker({
    daysOfWeekDisabled: [0, 6],
    autoclose: true,
});

$("#s_dt").on('changeDate', function() {
    var st = $(this).datepicker("getDate");
    var end = st;
    console.log(st);
    end.toLocaleDateString();
    console.log(end);

    //use setStartDate to change startdate property dynamically
    $('#e_dt').val('').datepicker('setStartDate', end);             
});
user_46147280
Related