CODEWITHSUNDEEP
jquerydatepicker
Abbi
Abbi

Reputation: 597

setting minimum date in jQuery datepicker

I have to set the minimum date in the jQuery datepicker.

Only allowed values are 1st of the next three months. So I want the calendar to open to the next month instead of existing month.

when I set the min Date to +1M it does open Jan 2014 calendar instead of dec 2013 but the 1st of that month is disabled.

If I set minDate to -0, I see dec calendar with no valid select option as 1st has already passed. The user has to go to next month to and the 1st is selectable. My code is: 

$("#effdatepicker").datepicker({
    showOn: "button",
    buttonImage: "images/calendar.gif",
    buttonImageOnly: true,
    minDate: "+1M",
    maxDate: "+3M",
    beforeShow: function () {
        if (jQuery('#enddatepicker').val() != "") {
            jQuery(this).datepicker('option', 'maxDate', jQuery('#enddatepicker').val());
        }

    },
    beforeShowDay: function (date) {
        //getDate() returns the day (0-31)
        if (date.getDate() == 1) {
            return [true, ''];
        }
        return [false, ''];
    }

});

Upvotes: 2

Views: 1315

Answers (2)

Abbi
Abbi

Reputation: 597

Ended up doing like this. 

var d = new Date();
var d2 = new Date();

d.setMonth(d.getMonth() + 1);
d.setDate('1');
d2.setMonth(d2.getMonth() + 3);
d2.setDate('1');

$("#effdatepicker").datepicker({
showOn: "button",
buttonImage: "images/calendar.gif",
buttonImageOnly: true,
minDate: d,
maxDate: d2,
beforeShow: function () {
    if (jQuery('#enddatepicker').val() != "") {
        jQuery(this).datepicker('option', 'maxDate', jQuery('#enddatepicker').val());
    }

},
beforeShowDay: function (date) {
    //getDate() returns the day (0-31)
    if (date.getDate() == 1) {
        return [true, ''];
    }
    return [false, ''];
}
}).datepicker('setDate', d)

FIDDLE

Upvotes: 0

adeneo
adeneo

Reputation: 318172

var d  = new Date();
    d2 = new Date(),
    m  = d.getMonth(),
    y  = d.getFullYear();

d.setFullYear(m > 10 ? y+1 : y, (m < 11 ? m + 1 : 0), 1);
d2.setFullYear(m+3 > 10 ? y+1 : y, (m+3 < 11 ? m + 3 : (m + 3)-12), 1);

$("#effdatepicker").datepicker({
    showOn: "button",
    buttonImage: "images/calendar.gif",
    buttonImageOnly: true,
    minDate: d,
    maxDate: d2,
    beforeShow: function () {
        if (jQuery('#enddatepicker').val() != "") {
            jQuery(this).datepicker('option', 'maxDate', jQuery('#enddatepicker').val());
        }

    },
    beforeShowDay: function (date) {
        //getDate() returns the day (0-31)
        if (date.getDate() == 1) {
            return [true, ''];
        }
        return [false, ''];
    }
}).datepicker('setDate', d)

FIDDLE

Upvotes: 2

Related Questions