Floatinglabel Calendar
Last updated
Was this helpful?
Last updated
Was this helpful?
(part of package 'Bootstrap Components') Extends designtime/SolutionModel: JSWebComponent Extends runtime: RuntimeWebComponent
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 here.
Indicates whether calendar week numbers should be displayed. Type: Boolean 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
Error message to be displayed if the entered date is invalid. Type:
Whether to only allow date entry from the date picker or not (cannot type the date). Type: Boolean Default Value: false
Whether to select the text when date field is focused. Type: Boolean
The visual theme applied to the calendar (e.g. light or dark). Type: String Default Value: "light"
@param {JSEvent} event The event object containing information about the action event
Parameters:
{JSEvent} event
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:
{JSEvent} event The event object associated with the data change
Returns: {Boolean}
@param {JSEvent} event The event object containing details about the focus event
Parameters:
{JSEvent} event
@param {JSEvent} event The event object containing details about the focus loss event
Parameters:
{JSEvent} event
Dates that should be disabled.
Parameters:
{Array<Date>} dateArray An array of dates to be disabled in the component.
{Boolean} [keepInvalid] A flag indicating whether to retain previously disabled dates that are no longer valid (true) or to remove them (false).
Days of the week that should be disabled. Values are 0 (Sunday) to 6 (Saturday).
Parameters:
{Array<Number>} dayArray An array of numbers representing the days of the week to be disabled, where 0 corresponds to Sunday and 6 to Saturday.
{Boolean} [keepInvalid] A flag indicating whether to retain previously disabled days that are no longer valid (true) or to remove them (false).
Set the focus to this calendar.
Example:
Parameters:
{Boolean} [mustExecuteOnFocusGainedMethod] if false will not execute the onFocusGained method; the default value is true
Set the min date or max date that can be selected
Parameters:
Toggles the display of the error message for the component.
Parameters:
{Boolean} show A flag indicating whether to show (true) or hide (false) the error message.
Text to be shown as a floating label in the calendar input field. Type:
The date format string used to display and parse the date. 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 tooltip text shown when hovering over the calendar. Type:
Whether the button is visible or not Type:
{} oldValue The previous date value from the data provider
{} newValue The new date value to be set in the data provider