Set End Date After Select Start Date

JSFIDDLE How can I set end date which must be 1 day after than start date? $('#beginDate').datepicker({ minDate: 1, changeMonth: true, dateFormat: 'mm/dd/yy', onClo

Solution 1:

Just update one line in your code onclose event of beginDatePicker use this line

var minDate2 = newDate(selectedDate);
minDate2.setDate(minDate2.getDate() + 1);
$("#endDate").datepicker("option", "minDate", minDate2);

instead of

$("#endDate").datepicker("option", "minDate", selectedDate);

fiddle

Solution 2:

For example, in this sample code, startDatePicker is selected as 2014-3-18, change event of startDatePicker sets the minDate of endDatePicker 2014-3-19. It locks the cells before this date. I hope it helps...

        $("#startDatePicker").datepicker({
        dateFormat: 'yy-mm-dd',
        changeMonth: true,
        minDate: newDate(),
        maxDate: '+2y',
        onSelect: function (date) {

            var selectedDate = newDate(date);
            var msecsInADay = 86400000;
            var endDate = newDate(selectedDate.getTime() + msecsInADay);

            $("endDatePicker").datepicker("option", "minDate", endDate);
            $("endDatePicker").datepicker("option", "maxDate", '+2y');

        }
    });

    $("endDatePicker").datepicker({
        dateFormat: 'yy-mm-dd',
        changeMonth: true
    });

Solution 3:

Issue is that datepicker i expecting a date datatype.

            var date = newDate(selectedDate);
            date.setDate(date.getDate() +1);
            console.log(selectedDate, date);
            $("#endDate").datepicker("option", "minDate", date);
            $("#endDate").datepicker("option", "maxDate", date);

Updated jsFiddle

Solution 4:

Make a date difference. It will invisible the date.

$(function() {
    $( "#beginDate, #endDate" ).datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        onSelect: function( selectedDate ) {
            if(this.id == 'beginDate'){
              var dateMin = $('#beginDate').datepicker("getDate");
              var rMin = newDate(dateMin.getFullYear(), dateMin.getMonth(),dateMin.getDate() + 1); 
              $('#endDate').datepicker("option","minDate",rMin);
              $('#endDate').datepicker('setDate', rMin);                    
            }

        }
    });