react-datepicker
react-datepicker copied to clipboard
No event triggered when typing non-date-related input
If I type "incorrect" values in the input fields nothing happens, no event is triggered. E.g. if I type 12122020
(instead of 12/12/2020
).
I would expect to have the onDatesChange
triggered so I can display an alert to the user.
This is my implementation:
import React, {useReducer} from 'react';
import {DateRangeInput} from '@datepicker-react/styled'
import moment from 'moment';
const ORIGIN_OF_TIME = 1410868800000;
const initialState = {
startDate: moment().subtract(1, 'days').toDate(),
endDate: moment().toDate(),
focusedInput: null,
};
const reducer = (state, action) => {
switch (action.type) {
case 'focusChange':
return {...state, focusedInput: action.payload};
case 'dateChange':
return action.payload;
default:
throw new Error();
}
};
const App = () => {
const [state, dispatch] = useReducer(reducer, initialState);
return (
<DateRangeInput
onDatesChange={data => dispatch({type: 'dateChange', payload: data})}
onFocusChange={focusedInput => dispatch({type: 'focusChange', payload: focusedInput})}
startDate={state.startDate}
endDate={state.endDate}
minBookingDate={moment.unix(ORIGIN_OF_TIME).toDate()}
maxBookingDate={moment().toDate()}
focusedInput={state.focusedInput}
minBookingDays={1}
/>
);
};
Let me know :)
I forgot to mention:
"@datepicker-react/styled": "^2.7.0",
"moment": "^2.27.0",
"react": "^16.13.1",
@ClemRz any solution on this? I am having the same problem :(
@riaGh0sh you can look at my commit. The other option is tu use a different component, there are plenty out there...