The reason many people choose to use DateBox over the other available options is that it includes a massive amount of data limiting controls. You are able to specify exactly what is valid data through the control - of course, you should still verify data on your end, but for the normal user, this will prevent them from submitting bad data through ignorance.
Data limiting works in a number of ways - there are options to disallow individual dates, individual days (such as weekends), recurring dates, or even limit to just a set of specifically good data. Similar options are available for time entry. Additionally options exist to jump to known good dates, and to highlight preferred dates or days as needed.
Precedence is simple. A Date or Time is considered valid unless (in this order):
All limit checks are run on every date and every time, if they are set. So, setting a date limit for a time mode will often produce unusual results.
The below list are all of the limiting options available in DateBox
Dates selected must be after today's real date, or, all dates prior to today's date are invalid.
This is based on the first open of the widget - should a page be opened very close to midnight, an off-by one error might appear.
Dates selected must be before today's real date, or, all dates after to today's date are invalid.
This is based on the first open of the widget - should a page be opened very close to midnight, an off-by one error might appear.
A list (array) of ISO-8601 (YYYY-MM-DD) dates that are to be considered invalid.
Processing order:
// Christmas and New Years, 2000/2001
["2001-01-01", "2000-12-31", "2000-12-25", "2000-12-24"]
A list of recurring dates that are to be consided invalid.
Each date element is an array of the format
[<year>, <month>, <date>]
Additionally, using "-1" as an element treats it as a wildcard, that is "every year/month/day"
Processing order:
// (Chrismas, Christmas Eve, New Years Eve, and New Years Day, Every Year)
[ [-1,0,1], [-1,11,31], [-1,11,25], [-1,11,24] ]
A list of periodic dates to blacklist.
Takes an array of the format
[<start date>, <period>]
// (Every other wednesday)
[ "2019-09-11", 14 ]
A list (array) of days of the week that are to be considered invalid. Zero based ( 0 = Sunday … 6 = Saturday )
Processing order:
// Weekends
[ 0, 6 ]
List of 2-element arrays to show in a special pick list. Used with calShowDateList.
The inner array structure is:
[ISO-Date, Description]
[ ["1980-04-25", "JT's Date of Birth"], ["1809-02-12", "Lincoln's Birthday"] ]
Array of ISO-8601 (YYYY-MM-DD) dates that are exclusively valid and all others should be disabled. If this is in use, no other date checks are performed.
Processing order:
// Christmas, Christmas Eve, and New Years Eve of 2000 exclusively
[ "2000-12-31", "2000-12-25", "2000-12-24" ]
An alternate list of dates to highlight with theme.cal_DateHighAlt
```js // December 2000 Holiday Seson ["2001-01-01", "2000-12-31", "2000-12-25", "2000-12-24"]
An list of dates to highlight with theme.cal_DateHigh
```js // December 2000 Holiday Seson ["2001-01-01", "2000-12-31", "2000-12-25", "2000-12-24"]
A list of recurring dates to highlight with theme.cal_DateHighRec
Each date element is an array of the format
[<year>, <month>, <date>]
Additionally, using "-1" as an element treats it as a wildcard, that is "every year/month/day"
// (Chrismas, Christmas Eve, New Years Eve, and New Years Day, Every Year)
[ [-1,0,1], [-1,11,31], [-1,11,25], [-1,11,24] ]
A list of periodic dates to highlight with theme.cal_DateHighRec
Takes an array of the format
[<start date>, <period>]
// (Every other wednesday)
[ "2019-09-11", 14 ]
A list (array) of days of the week that are to be highlighted with theme.cal_DayHigh.
Zero based ( 0 = Sunday … 6 = Saturday )
// Weekends
[ 0, 6 ]
ISO string minimum date (YYYY-MM-DD) (Inclusive!)
ISO string maximum date (YYYY-MM-DD) (Inclusive!)
Only accept dates that are today - # of days in the future (min).
Both options will accept negative numbers:
minDays = 10
maxDays = -5
This would allow only days that are 5 to 10 days in the past to be choosen.
Only accept dates that are today + # of days in the future (max)
Both options will accept negative numbers:
minDays = 10
maxDays = -5
This would allow only days that are 5 to 10 days in the past to be choosen.
Do not allow durations less (min) or greater (max) than this to be selected.
Do not allow durations less (min) or greater (max) than this to be selected.
Allow only hours before (min) or after (max) this to be selected.
Allow only hours before (min) or after (max) this to be selected.
Allow only times before (min) or after (max) this to be selected. Format is 24hr clock - i.e. 18:31
Note: this limits date selection to TODAY (datetime modes).
Allow only times before (min) or after (max) this to be selected. Format is 24hr clock - i.e. 18:31
Note: this limits date selection to TODAY (datetime modes).
Do not allow years before (min) or after (max) this one to be selected.
Do not allow years before (min) or after (max) this one to be selected.
Allows those dates that are not the true value of the client's today (new Date(); at widget open) to be selected.
Note: if used with time only modes, this will break them.
List of 2-element arrays to show in a special pick list. Used with slideShowDateList.
The inner array structure is:
[ISO-Date, Description]
[ ["1980-04-25", "JT's Date of Birth"], ["1809-02-12", "Lincoln's Birthday"] ]
Array of valid hours to choose (24hr based)
// Standard working hours
[ 9, 10, 11, 12, 13, 14, 15, 16, 17 ]
A list (array) of ISO-8601 (YYYY-MM-DD) dates that are to be considered valid always.
Processing order:
// Christmas and New Years, 2000/2001
["2001-01-01", "2000-12-31", "2000-12-25", "2000-12-24"]