Date Picker
- To download the QEX file (inside the example directory), click here.
- Version of the ADC: 2.0.2.
This control is compatible with all date questions. If the question is using Date and Time, then only apply this ADC to the input for the date part. For the time part use the Time Picker.
This ADC only uses plain JavaScript and is based on the Pikaday plugin by dbushell. The original code can be found at https://github.com/dbushell/Pikaday.
| Property | Description | Options/ possible values |
| General | ||
|---|---|---|
| Theme | Select the theme of the calendar | Light theme; Dark theme |
| Selected Color | Background colour of selected date | Any RGB colour |
| Selected Text Colour | Font Colour of selected date | Any RGB colour |
| Hover Color | Colour of background when date hovered on | Any RGB colour |
| Hover Text Color | Colour of font when date hovered upon | Any RGB colour |
| Date | ||
| Show datepicker | Automatically show/hide the Date Picker on field focus (default true if field is set) | Show; Hide |
| Position | Preferred position of the Date Picker relative to the form field, e.g.: top right, bottom right Note: automatic adjustment may occur to avoid Date Picker from being displayed outside the viewport, see positions example (default to 'bottom left') | bottom left; top left; top right; bottom right |
| defaultDate | The initial date to view when first opened | Yes; No |
| setDefaultDate | Make the defaultDate the initial selected value | Yes; No |
| firstDay | First day of the week for the calendar | Sunday; Monday; Tuesday; Wednesday; Thursday; Friday; Saturday |
| disableWeekends | Disallow selection of Saturdays and Sundays | Disallow; Allow |
| showWeekNumber | Show the ISO week number at the head of the row (default false) | Show; Hide |
| showMonthAfterYear | Render the month after year in the title (default false) | Month last; Month first |
| numberOfMonths | Number of visible calendars | 1;2;3 |
| mainCalendar | When numberOfMonths is used, this will help you to choose where the main calendar will be (default left, can be set to right). Only used for the first display or when a selected date is not already visible | Left; Right |
The Ranges for the date question are still controlled via the Minimum and Maximum Values of the question.