react-datepicker icon indicating copy to clipboard operation
react-datepicker copied to clipboard

No event triggered when typing non-date-related input

Open ClemRz opened this issue 4 years ago • 3 comments

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 :)

ClemRz avatar Jul 21 '20 03:07 ClemRz

I forgot to mention:

"@datepicker-react/styled": "^2.7.0",
"moment": "^2.27.0",
"react": "^16.13.1",

ClemRz avatar Jul 21 '20 03:07 ClemRz

@ClemRz any solution on this? I am having the same problem :(

riaGh0sh avatar Feb 25 '21 07:02 riaGh0sh

@riaGh0sh you can look at my commit. The other option is tu use a different component, there are plenty out there...

ClemRz avatar Feb 25 '21 13:02 ClemRz