I’ve been trying to create a datepicker field that can allow for certain invalid date ranges i.e. 00 if the DD or MM for a date of birth is of an unknown value. The base UI components that I am using are MUI’s DatePicker and MUI’s FilledInput / TextField. For instance, a person with a birth date of March 1943 should be able to input their DOB as 00 / 03 / 1943 on the frontend.
So far, as far as I understand and read, this can’t be done with input fields of ‘type = “date”‘ as 00 would be autocorrected to 01.
As a continuation to the above question, I have used a standard text field instead with masking, such as react-imask library and it works (sort of haphazardly). A key feature that I am still missing if I were to use a text field is that my text input is not split neatly into each date block (Day or Month or Year) like the MUI example attached
enter image description here
My questions are:
- Is there a way to build such a custom datepicker using date inputs?
- If not, would using a text field be a suitable solution to the problem?
- How can I get the described behavior to get my blocks of text to correspond to each date block?