date-input
Overview
date-input allows users to select a date from a calendar.
Basic Example
<var name="delivery_date" type="date"/>
<date-input label="Delivery date" bind="delivery_date" required="false" />
Standard Attributes
bind
bindbindlabel
labellabelrequired
requiredrequiredAdvanced Attributes
align-content
align-contentalign-contentalign-label
align-labelalign-labelclear-button-visibility
clear-button-visibilityclear-button-visibilitydisabled
disableddisablederror-message
error-messageerror-messageid
ididicon-position
icon-positionicon-positionlabel-case
label-caselabel-caselabel-color
label-colorlabel-colormodifier-text
modifier-textmodifier-texton-change
on-changeon-changeplaceholder
placeholderplaceholdershow-if and hide-if
show-ifhide-ifshow-if and hide-ifComponent Methods
The following component methods are available when an id is assigned to the component and component.dateInput({id:'my-id'}) is called from JS/TS:
clear
clearProgrammatically clear the selected date bound to the date-input component.
pickDate
pickDateProgrammatically open the date picker to allow the user to select or update a date value.
scrollIntoView
scrollIntoViewProgrammatically scroll until the date-input is visible in the view.
Last updated