How to Disable Saturdays, Sundays, and Holidays in jQuery UI Datepicker?

Disable Saturdays, Sundays, and Holidays in jQuery UI Datepicker

The jQuery UI Datepicker provides convenient date selection functionality, but it may not always meet specific requirements. For example, you may want to exclude certain days of the week or holidays from being selectable. Here's how to disable Saturdays, Sundays, and holidays using jQuery UI Datepicker.

Using the beforeShowDay Option

The beforeShowDay option allows you to specify a function that will be called for each day displayed in the datepicker. By returning true or false from this function, you can control whether or not a date is selectable.

To disable Saturdays and Sundays, use the following code:

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

Combining Exclusion Rules

Suppose you also want to exclude holidays. In that case, you can create a custom function that combines the noWeekends logic with your holiday exclusion logic.

Assuming you have a nationalDays function that returns false for holidays:

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

And then set it as the beforeShowDay callback:

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

Note: In jQuery UI 1.8.19 and later, the beforeShowDay option supports an optional third parameter for displaying a tooltip on mouse hover over disabled dates.

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