One of the things I wanted to do is to block certain dates from being enabled in the JQuery UI Datepicker widget. There is built-in functionality for blocking weekends, but not for particular dates, e.g., Christmas. Some web searching led me to a fairly easy solution. The widget has an option for providing a function to call before a date is shown. Here is my widget constructor:
$('#datepicker').datepicker({ inline: true, showOn: "both", buttonImage: "/cafemarburg/images/calendar.jpg", minDate: +1, maxDate: +180, beforeShowDay: checkClosedDates });
checkClosedDates is a function that returns an array of the form [true/false, a class to add, a tooltip message], the last two being optional. It takes the date (as a Javascript object) as a parameter.
Here is the function call:
var closedFullDates = new Array(); // Used for one-time closures or irregular scheduled holidays var closedYearlyDates = new Array('12-25','7-4'); // Used to regular holidays (e.g., Christmas) var closedDaysOfWeek = new Array('0') function checkClosedDates(date) { var blocked = false; var ymd = date.getFullYear() + '-' + (date.getMonth()+1) + '-' + date.getDate(); var md = (date.getMonth()+1) + '-' + date.getDate(); if ($.inArray(ymd,closedFullDates) > -1) { blocked = true; } else if ($.inArray(md,closedYearlyDates) != -1) { blocked = true; } else if ($.inArray(String(date.getDay()),closedDaysOfWeek) != -1) { blocked = true; } if (blocked) { return [false,'dpClosedDate','Sorry, we are closed that day.']; } else { return [true]; } }
As can be seen, I use three separate arrays. One is for one-time events or events that change date year to year. Another is for dates that occur on the same date. The third is for days of the week.