DatePicker input pattern validation
alexbeletsky opened this issue · 6 comments
I have <DatePicker /> without value and defaultValue, only listening to onChange and updates redux storage.
Once I selected the date and try to submit my form, I see error pops-up by Chrome,
The pattern I see,
It looks strange, because \d\d\d would not match Wed and also, not sure about 00/00/000 would it work at all?
Will providing pattern prop allow to workaround the problem?
The problem is likely here,
https://github.com/alexkuz/react-input-enhancements/blob/master/src/DatePicker.jsx#L28
Why props.pattern.replace(/ddd/g, '\\d\\d\\d').replace(/[DMY]/g, '0')?
Just quickly tried it in Chrome, this pattern seems to work,
\w{3,} \d\d/\d\d\/\d\d\d\d
But honestly, I would just throw the default value away, since very likely you perform validation of fields anyway. If user wants to have HTML pattern attribute, she can submit it via props. What do you think? @alexkuz
Yes, the error here is that <input /> receives this pattern, which it shouldn't - it's a pattern for <Mask /> (and it's not a regex, obviously).
I'm looking to the code right now.. I don't want to modify before I can run in in demo app, currently having such a problem with the build.
Any hints?
As for issue, I would avoid using { ...props } here,
https://github.com/blogfoster/react-input-enhancements/blob/master/src/DatePicker.jsx#L78
and do explicit props for <InputPopup />, and put only required properties.. What do you think?
PR #36