Framework 7 Calendar — Reference

Framework 7 Calendar

Framework 7 Calendar settings and events. Select the component in App Structure to find these controls in Properties.

Calendar Properties

Name	Description
ID	Required. Default: "". Attribute: id.
Locale	Attribute: locale.
First Day	Default: 1. Attribute: first-day.
Multiple	Default: false. Attribute: multiple.
Range Picker	Default: false. Attribute: range-picker.
Range Picker Min Days	Default: 1. Attribute: range-picker-min-days.
Range Picker Max Days	Default: 0. Attribute: range-picker-max-days.
Direction	Options: Horizontal (horizontal), Vertical (vertical) Default: "horizontal". Attribute: direction.
Min Date	Default: "". Attribute: min-date.
Max Date	Default: "". Attribute: max-date.
Touch Move	Default: true. Attribute: touch-move.
Animate	Default: true. Attribute: animate.
Close On Select	Default: false. Attribute: close-on-select.
Week Header	Default: true. Attribute: week-header.
Month Selector	Default: true. Attribute: month-selector.
Month Picker	Default: true. Attribute: month-picker.
Year Selector	Default: true. Attribute: year-selector.
Year Picker	Default: true. Attribute: year-picker.
Year Picker Min	Attribute: year-picker-min.
Year Picker Max	Attribute: year-picker-max.
Time Picker	Default: false. Attribute: time-picker.
Time Picker Placeholder	Default: "Select time". Attribute: time-picker-placeholder.
Open In	Options: Auto (auto), Popover (popover), Sheet (sheet), Custom Modal (customModal) Default: "auto". Attribute: open-in.
Sheet Push	Default: false. Attribute: sheet-push.
Scroll To Input	Default: true. Attribute: scroll-to-input.
Input Read Only	Default: true. Attribute: input-read-only.
Close By Outside Click	Default: true. Attribute: close-by-outside-click.
Toolbar	Default: true. Attribute: toolbar.
Toolbar Close Text	Default: "Done". Attribute: toolbar-close-text.
Header	Default: false. Attribute: header.
Header Placeholder	Default: "Select date". Attribute: header-placeholder.
Close By Backdrop Click	Default: true. Attribute: close-by-backdrop-click.

Set value

Name	Description
Value	Default: "".

Add value

Name	Description
Value	Default: "".

Next month

Name	Description
Duration	Default: "".

Prev month

Name	Description
Duration	Default: "".

Set year month

Name	Description
Year	Default: "".
Month	Default: "".
Duration	Default: "".

Dynamic attributes

Name	Description
Locale	Choose dynamic data binding.
Value	Choose dynamic data binding.
First Day	Choose dynamic data binding.
Weekend Days	Choose dynamic data binding.
Multiple	Choose dynamic data binding.
Range Picker	Choose dynamic data binding.
Range Picker Min Days	Choose dynamic data binding.
Range Picker Max Days	Choose dynamic data binding.
Direction	Choose dynamic data binding.
Min Date	Choose dynamic data binding.
Max Date	Choose dynamic data binding.
Touch Move	Choose dynamic data binding.
Animate	Choose dynamic data binding.
Close On Select	Choose dynamic data binding.
Week Header	Choose dynamic data binding.
Month Selector	Choose dynamic data binding.
Month Picker	Choose dynamic data binding.
Year Selector	Choose dynamic data binding.
Year Picker	Choose dynamic data binding.
Year Picker Min	Choose dynamic data binding.
Year Picker Max	Choose dynamic data binding.
Time Picker	Choose dynamic data binding.
Time Picker Placeholder	Choose dynamic data binding.
Open In	Choose dynamic data binding.
Sheet Push	Choose dynamic data binding.
Scroll To Input	Choose dynamic data binding.
Input Read Only	Choose dynamic data binding.
Close By Outside Click	Choose dynamic data binding.
Toolbar	Choose dynamic data binding.
Toolbar Close Text	Choose dynamic data binding.
Header	Choose dynamic data binding.
Header Placeholder	Choose dynamic data binding.
Close By Backdrop Click	Choose dynamic data binding.
Params	Choose dynamic data binding.

Dynamic events

Name	Description
Dayclick	Action: Choose the action to execute.
Change	Action: Choose the action to execute.
Open	Action: Choose the action to execute.
Opened	Action: Choose the action to execute.
Close	Action: Choose the action to execute.
Closed	Action: Choose the action to execute.