# Calendar (Advanced options)

## Calendar option settings

Note: these settings should be placed in the "options" field within your json. [See example below](#example)

| Property                    | Description                                                                                                                                                       |
| --------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 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               | <p>Month short names.<br>Default: \['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']</p>                                       |
| monthsFull: array           | <p>Month short names.<br>Default: \['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']</p> |
| weekdays: array             | <p>Weekday names.<br>Default: \['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']</p>                                                 |
| weekdays\_short: array      | <p>Weekday short names.<br>Default: \['S', 'M', 'T', 'W', 'T', 'F', 'S']</p>                                                                                      |
| 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

```json
{
    "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"]
    }
}
```
