Dependency
This component is powered by js-datepicker.
Install library
npm install js-datepicker
Basic usage
Add data-anim-datepicker to an input field.
Basic example
<input
class="input"
data-anim-datepicker
type="text"
autocomplete="off"
name="form[]"
>
Attributes
-
data-anim-datepicker— activate datepicker -
data-anim-datepicker-lang="en"— language -
data-anim-datepicker-startday="1"— week start day
Example with settings
Custom configuration
<input
class="input"
data-anim-datepicker
data-anim-datepicker-lang="en"
data-anim-datepicker-startday="1"
type="text"
autocomplete="off"
>
Features
- Lightweight and fast
- Multi-language support
- Multiple inputs supported
- Customizable UI
How it works
- Page loads and finds inputs with attribute
- js-datepicker initializes
- Language and settings are applied
- User selects a date
- Value is written into input
Download
Use Datepicker to improve UX of forms and allow users to quickly select dates with a clean interface.