Is there a way to customize the react date picker to include seconds as well? I have looked through the documentation but couldn't find an option for selecting seconds. Any help or example would be appreciated, you can check out the input Time section (look for input Time)
I attempted to change the date format using dateFormat="MM/dd/yyyy h:mm:ss aa" but it didn't work.
() => {
const [startDate, setStartDate] = useState(new Date());
return (
<DatePicker
selected={startDate}
onChange={date => setStartDate(date)}
timeInputLabel="Time:"
dateFormat="MM/dd/yyyy h:mm aa"
showTimeInput
/>
);
};
I managed to display seconds by implementing a custom time input which is working fine. However, when used inside a MaterialUi Dialog, the entire dialog closes after selecting a time.
() => {
const [startDate, setStartDate] = useState(new Date());
const ExampleCustomTimeInput = ({ value, onChange }) => (
<input
type="time"
step="1"
value={value}
onChange={e => onChange(e.target.value)}
style={{ border: "solid 1px pink" }}
/>
);
return (
<DatePicker
selected={startDate}
onChange={date => setStartDate(date)}
showTimeInput
customTimeInput={<ExampleCustomTimeInput />}
/>
);
};