disabledDaysOfWeek

Sets or gets the days of the week that a site visitor can't select.

Description

Setting the disabledDaysOfWeek property prevents site visitors from selecting the specified days of the weeks.

Set disabledDaysOfWeek to an empty array ([]) to remove the current disabled days of the week.

Getting the disabledDaysOfWeek property returns the current list of disabled days of the week.

The disabledDaysOfWeek property accepts an array of integers from 0 to 6, where 0 represent Sunday, 1 is Monday, 2 is Tuesday, and so on.

If a date falls on a disabled day of the week, but is also set as an enabled date with the enabledDateRanges property, the date is disabled and the site visitor can't select the date in the date picker.

Type:

Array<number>Read & Write

Related Content:

disabledDateRanges

Was this helpful?

Get which days of the week are disabled

Copy Code

1let days = $w("#myDatePicker").disabledDaysOfWeek;
2
3let secondDisabledDay = days[1]; // 6

Disable weekends

Copy Code

1$w("#myDatePicker").disabledDaysOfWeek = [0, 6];

Disable weekends and holidays that occur during date ranges that are enabled

This example demonstrates how to:

Enable certain months in the date picker, such as for an "on call" roster for a team
Disable holidays
Disable weekends

Copy Code

1const roster = [
2  {
3    startDate: new Date('1/1/2022'),
4    endDate: new Date('1/31/2022')
5  },
6  {
7    startDate: new Date('4/01/2022'),
8    endDate: new Date('4/30/2022')
9  },
10  {
11    startDate: new Date('7/01/2022'),
12    endDate: new Date('7/31/2022')
13  },
14  {
15    startDate: new Date('10/01/2022'),
16    endDate: new Date('10/31/2022')
17  }
18];
19
20const holidays2022 = [
21  {
22    startDate: new Date('4/15/2022'),
23    endDate: new Date('4/17/2022')
24  },
25  {
26    startDate: new Date('12/25/2022'),
27    endDate: new Date('01/01/2023')
28  }
29];
30
31$w('#myDatePicker').enabledDateRanges = roster;        // Available on 1st month of each quarter   
32$w('#myDatePicker').disabledDateRanges = holidays2022; // Not available on holidays
33$w('#myDatePicker').disabledDaysOfWeek = [0, 6];       // Not available on weekends