react-flatpickr
react-flatpickr copied to clipboard
Toggling AM/PM selector returns empty date
Hi, I'm using version 3.9.0 of react-flatpickr on react 16.8.6, thanks for building it :)
I'm encountering a strange issue with the AM/PM toggle using the time picker with react hooks.
Example code exhibiting the problem can be found here (output in the console): https://codesandbox.io/s/react-example-6vwj8
Basically, Whenever I toggle the AM/PM in the time picker, onChange
fires twice, the first time with the updated value and the second time with an empty string which wipes out my stored value. Even stranger, some times work and others don't. The other funny thing is the first argument to onChange
selectedDates
is an array containing the correct updated value both times but dateStr
is wrong the second time around.
I changed my code to use the value from selectedDates
instead of dateStr
and it's working but I need to do this:
setMeetingTime(moment(selectedDates[0]).format('YYYY-MM-DDTHH:mm'))
instead of this:
setMeetingTime(dateStr)
So it's not ideal
I'm using react-flatpickr version 3.10.12 with flatpickr version 4.6.13 and react 18.1.0 and this still seems to be a problem. When using moment, the value property only seems to take 'YYYY-MM-DDTHH:mm'
as a string and ignores all other string inputs such as 'YYYY-MM-DDThh:mm A'
. The time picked can be turned into a moment instant without issue, but value can't be set to any other format.
Note: I also tried to use altInput
and altFormat
from flatpickr options and I got altFormat: "F j, Y"
to produce a date like June 11, 2022
, but I could not get the time or am/pm to work without errors occurring. Maybe I'm not understanding the time format that altFormat
uses or the flatpickr documentation properly.