1.0.7 • Published 2 years ago
@annoyingmouse/wc-date-input v1.0.7
This web component creates a configurable date input similar to that suggested by the UK Government.
If you're anything like me, you'll find scrolling through months looking for your date of birth painful on android devices. Demo here.
Usage
<wc-date-input></wc-date-input>
<script type="module" src="wc-date-input.js"></script>Configuration
- Adding a
valuewill allow you to pre-populate the input - the value date will be checked and ignored if invalid. - Adding a
minvalue will allow you to set a minimum valid date - the min date will be checked for validity and ignored if invalid. - Adding a
maxvalue will allow you to set a maximum valid date - the max date will be checked for validity and ignored if invalid. - Adding
disableddisables the input. - Adding
requiredenables validation of the input. The component is opinionated about what it will allow you to enter (invalid dates or those outside the min and max range will not be accepted) - you should not be able to enter invalid dates. - Adding
readonlyprevents the input from changing. - Adding
data-day-textallows you to change the label above the day input. - Adding
data-month-textallows you to change the label above the month input. - Adding
data-year-textallows you to change the label above the year input. - Adding
data-value-missingallows you to customise the validation message if required is set. - Adding
data-error-textallows you to use external validation to set the field as invalid.
License
MIT