jquery datepicker set mindate

javascript, jquery

Solution

To limit one datepicker based on the other, one can set the `minDate` and `maxDate` settings to the date selected in the other datepicker etc.

Something like this

$(function() {

     /* global setting */
    var datepickersOpt = {
        dateFormat: 'dd-mm-yy',
        minDate   : 0
    }

    $("#from_date").datepicker($.extend({
        onSelect: function() {
            var minDate = $(this).datepicker('getDate');
            minDate.setDate(minDate.getDate()+2); //add two days
            $("#to_date").datepicker( "option", "minDate", minDate);
        }
    },datepickersOpt));

    $("#to_date").datepicker($.extend({
        onSelect: function() {
            var maxDate = $(this).datepicker('getDate');
            maxDate.setDate(maxDate.getDate()-2);
            $("#from_date").datepicker( "option", "maxDate", maxDate);
        }
    },datepickersOpt));
});

Problem

I have two jQuery datepickers to select a from and to dates. I have the following code that if you select the 15th June in the first then in the second you now can only select from the 15th onwards. The issue I have is I really need to set the to datepicker to +1 day. So the user could only select 16th onwards. My skills are not advanced enough to add the date to the parseDate ``` $(function() { var dates = $( "#from_date, #to_date" ).datepicker({ dateFormat: 'dd-mm-yy', minDate: 0, onSelect: function( selectedDate ) { var option = this.id == "from" ? "minDate" : "maxDate", instance = $( this ).data( "datepicker" ), date = $.datepicker.parseDate( instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings ); dates.not( this ).datepicker( "option", option, date ); } }); }); ```

Original source