Last updated
Was this helpful?
Last updated
Was this helpful?
(part of package '') Extends designtime/SolutionModel: Extends runtime:
Calendar is an input control component. It allows using a date-picker to choose Date values for a bound data-provider. The key difference compared to the Calendar-Inline component is that this Calendar component is an input field that the shows the date-picker in a popup only when clicked; whereas the Calendar-Inline shows the date-picker directly on the form.
This is a reference page; many components have detailed usage guides .
Indicates whether calendar week numbers should be displayed. Type: Default Value: true
The bound data provider identifier representing the Date value. Type:
Flag indicating whether the calendar is enabled for user interaction. Type: Default Value: true
The date format string used to display and parse the date. Type:
@param {JSEvent} event The event object containing information about the action event
Parameters:
Handle changed data, return false if the value should not be accepted. JSEvent.data will contain extra information about dataproviderid, its scope and the scope id (record datasource or form/global variable scope)
Parameters:
@param {JSEvent} event The event object containing details about the focus event
Parameters:
@param {JSEvent} event The event object containing details about the focus loss event
Parameters:
Dates that should be disabled.
Parameters:
Days of the week that should be disabled. Values are 0 (Sunday) to 6 (Saturday).
Parameters:
Set the focus to this calendar.
Example:
Parameters:
Set the min date or max date that can be selected
Parameters:
See https://getdatepicker.com/6/options/ what options you can set, some could be overridden by the locale again Type:
Whether to only allow date entry from the date picker or not (cannot type the date). Type: Default Value: false
Placeholder text displayed when no date is selected. Type:
Whether to select the text when date field is focused. Type:
Set the styleclasses that should be applied at to this component Type: Default Value: "form-control"
The tab sequence order for keyboard navigation. Type:
The visual theme applied to the calendar (e.g. light or dark). Type: Default Value: "light"
The tooltip text shown when hovering over the calendar. Type:
Whether the button is visible or not Type:
{} event
{} oldValue The previous date value from the data provider
{} newValue The new date value to be set in the data provider
{} event The event object associated with the data change
Returns: {}
{} event
{} event
{} dateArray An array of dates to be disabled in the component.
{} [keepInvalid] A flag indicating whether to retain previously disabled dates that are no longer valid (true) or to remove them (false).
{} dayArray An array of numbers representing the days of the week to be disabled, where 0 corresponds to Sunday and 6 to Saturday.
{} [keepInvalid] A flag indicating whether to retain previously disabled days that are no longer valid (true) or to remove them (false).
{} [mustExecuteOnFocusGainedMethod] if false will not execute the onFocusGained method; the default value is true
{} minDate The earliest date that can be selected in the component.
{} maxDate The latest date that can be selected in the component.
{} [keepInvalid] Optional. A flag indicating whether to retain previously restricted dates that are no longer valid (true) or to remove them (false).