date-picker
date-picker copied to clipboard
duetds
input control's value never gets updated unless 10 or 0 characters long
Describe the bug Hi, I'm noticing that the input control never registers the value has been changed unless the input value is 0 or 10 characters (e.g. a date 2002-02-02) in length.
If it's 2002-02-0 it will not update the value.
But if you change 2002-02-0 to 2002-02-02 it will update the value, or if you change "2" to "".
To Reproduce Steps to reproduce the behavior:
-
Go to date control
-
input 2002-02-02
-
change it to 2002-02-0
-
look for the form value to change, doesn't change
-
Go to date control
-
input 2002-00
-
change it to 2002-02-02
-
look for the form value to change, it will only change when you enter 2002-02-02
Expected behavior Every time you change the value the input control's value should change.
Screenshots
This was an intentional decision to ensure that the value is always a valid date (or empty string when input is cleared).
Perhaps we can be a bit more aggressive in setting to empty value - any invalid date should clear the value?
Possible duplicate of https://github.com/duetds/date-picker/issues/47?
Ok, thanks @WickyNilliams. It just seems strange that if you're editing the value via keyboard then the value you have on-screen is different from the one in the store until the value is a valid date or blank
I have just checked the behaviour of the native <input type="date">...
On invalid date, its value property is set to an empty string (in chrome and FF). So that happily aligns with my proposal above. So I will go with that.
If you want values as they are typed you could listen to an "input" event. But be aware you need a condition in your listener to filter out events from the year/month dropdowns. I may add a custom event for this purpose in future.
Edit: i just tested further and native date input does not raise input events for invalid dates. So you have no access to values as they are typed, unless you listen for keydown. I will endeavour to match native behaviour as much as possible.
what if we format the dates manually if the user forgets to add preceding 0s. ie. use duetBlur to change 2020-1-1 to 2020-01-01 in the input. How can we update the date-picker in that scenario?
Looks like I found a way, I can manually set the value of the date-picker as well 👍