jQuery datepicker: Disabled previous/next/any days

By | January 13, 2014

We have seen how to customize jquery datepicker in different condition. such as,

jQuery calender: Highlight date with different color
jQuery datepicker: change position of month and year drop down
jQuery Calender: Manage Year Range
jQuery Calender: Include month and year dropdown
jQuery Datepicker

Here today I am going to explain how to disabled previous days, next days or disabled any week days. As I mentioned jQuery datepicker is highly customize so that you just need to pass parameter to disabled previous and next day. In order to disabled any week day you need to write condition on beforeshowday function. Let’s see one by one.

How to disabled previous days or you can say passed days?

jQuery(‘div’).datepicker({‘minDate’ : 0});

output:

jQuery-datepicker-min-date-disabled

 

How to disabled next days or you can say future days?

jQuery(‘div.maxdate’).datepicker({‘maxDate’ : 0});

output:

jQuery-datepicker-max-date-disabled

How to disabled any week days? disabled saturday and sunday.

jQuery(‘div.anydate’).datepicker({
beforeShowDay : function(date){
if(date.getDay() == 0 || date.getDay() == 6){
return [false];
}else{
return [true];
}
}
});

output:

jQuery-datepicker-any-date-disabled

A full example:

Leave a Reply

Your email address will not be published. Required fields are marked *