Calendar (Advanced options)

Calendar option settings

Note: these settings should be placed in the "options" field within your json. See example below

PropertyDescription

type: string

Picker type: default | year-month-picker. Default: default

validRange: [ date, date ]

Date selection would be disabled out of this range. Default: null

startingDay: number

Starting weekday - 0 for sunday, 6 for saturday. Default: 0 (Sunday)

format: string

Date format. Default: YYYY-MM-DD

readonly: boolean

Input will be disabled for manual changes.

today: boolean

If no value is default, open the calendar on today as default. Default: false

time: boolean

Include a time picker on the calendar. Default: false

resetButton: boolean

Show reset button. Default: true

placeholder: string

Placeholder instructions

months: array

Month short names. Default: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']

monthsFull: array

Month short names. Default: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']

weekdays: array

Weekday names. Default: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']

weekdays_short: array

Weekday short names. Default: ['S', 'M', 'T', 'W', 'T', 'F', 'S']

value: string

Default date.

fullscreen: boolean

Render in fullscreen. Default: true for screenWidth: 800px

opened: boolean

Calendar starts opened. Default: false.

textDone: string

Text of the 'Done' button

textReset: string

Text of the 'textReset' button

textUpdate: string

Text of the 'Update' button

Example / options

{
    "id": "date",
    "header": "Date",
    "type": "calendar",
    "options": {
        // Date format
        "format": "DD/MM/YYYY",
        // Allow keyboard date entry
        "readonly": false,
        // Today is default
        "today": false,
        // Show timepicker
        "time": false,
        // Show the reset button
        "resetButton": true,
        // Placeholder
        "placeholder": "",
        // Translations can be done here
        "months":["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
        "weekdays": ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],
        "weekdays_short": ["S", "M", "T", "W", "T", "F", "S"]
    }
}

Last updated