DatePicker parse problem with date format
ugoQ opened this issue · comments
Describe the bug
First, I'd like to apologize if the problem is related to rff itself and not mui-rff, I just can't find a way to resolve this.
My problem is that I have a KeyboardDatePicker
with the format dd/MM/yyyy
and I don't want it's value stored as a Date
in rff, I want it to be stored as a string with the dd/MM/yyyy
format. The thing is, it's value is stored with the good format in the rff values, but the date is not good in the input (the months and days are inverted).
To Reproduce
Ok here is what I got.
First, my App is wrapped with a
<MuiPickersUtilsProvider utils={DateFnsUtils} locale={frLocale}></MuiPickersUtilsProvider>
In my component, I have this:
import { format } from "date-fns";
import { KeyboardDatePicker } from "mui-rff";
<KeyboardDatePicker
name={code}
label={label}
cancelLabel={"ANNULER"}
okLabel={"FERMER"}
clearLabel={"EFFACER"}
autoOk
clearable
format="dd/MM/yyyy"
autoComplete="off"
fieldProps={{
parse: value => format(value, 'dd/MM/yyyy')
}}
/>
Expected behavior
So, when I click on a day in the calendar, the value in rff is good with the format dd/MM/yyyy
, but the value in the input is not good, the months and the days are inverted.
Examples:
- if I click on the 4th of August 2021 (04/08/2021 in my desired format), the value in the input becomes 08/04/2021 (value is 04/08/2021 in rff)
- If I click on a day greater than 12, the value is not even set on the input, but is changed in rff
Any help would be gladly appreciated.
Hey, thanks for this. I'm going to move this to a discussion since it isn't really an issue per say. =) Let's continue over there...