javascript - jquery datepicker set mindate - Stack Overflow

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 );
            }
    });
    }); 

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 );
            }
    });
    }); 

• javascript
• jquery

Share Improve this question Follow asked May 3, 2013 at 22:36 Keith PowerKeith Power 14.2k2323 gold badges7171 silver badges140140 bronze badges 2

• I see minDate: 0, could this be changed to fulfill your purposes? – David Starkey Commented May 3, 2013 at 22:39
• Yes I already have it working setting the min date, I just need to add the ability to add one day to the above date code – Keith Power Commented May 3, 2013 at 22:44

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 18

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));
});