How can I disable Saturdays, Sundays, and Holidays in jQuery UI Datepicker?

Disabling Saturdays, Sundays, and Holidays in the jQuery UI Datepicker

The jQuery UI Datepicker is a versatile tool for selecting dates, but what if you need to disable certain days, such as weekends or holidays? Fortunately, there's a way to achieve this.

Using the beforeShowDay Option

The beforeShowDay option allows you to specify a callback function that will be called for each day in the datepicker. This function returns an array with two elements:

• [0]: true if the date is selectable, false if it's disabled
• [1]: A CSS class name(s) or an empty string for the default presentation

To disable Saturdays and Sundays, simply pass the $.datepicker.noWeekends function to beforeShowDay:

$(".selector").datepicker({ beforeShowDay: $.datepicker.noWeekends });

Combining with National Holidays

You can also exclude national holidays using the nationalDays function provided in the example above. To combine the two, use the following code:

function noWeekendsOrHolidays(date) {
    var noWeekend = $.datepicker.noWeekends(date);
    if (noWeekend[0]) {
        return nationalDays(date);
    } else {
        return noWeekend;
    }
}

Then, pass noWeekendsOrHolidays to beforeShowDay:

$(".selector").datepicker({ beforeShowDay: noWeekendsOrHolidays });

Note: In jQuery UI 1.8.19 and later, the beforeShowDay option also accepts an optional third parameter for a popup tooltip.

The above is the detailed content of How can I disable Saturdays, Sundays, and Holidays in jQuery UI Datepicker?. For more information, please follow other related articles on the PHP Chinese website!