How to avoid react date picker calendar to open on tab keypress from previous textbox

Question

We have installed react-datepicker component. The default behaviour is that the calendar is getting opened on tab keypress from previous field. How can I avoid this. Please suggest as I am unable to override the default behaviour of this component. I just want the focus to be on this control when tab is pressed.

Answer 1

You can open it manually:

<DatePicker
   ref={(c) => this._calendar = c}
   locale='ru'
    ...
   customInput={<InputField {...this.props} calendar={this._calendar}/>}
/>

And then somewhere

this._calendar.setOpen(bool)

Answer 2

You can use preventOpenOnFocus property

<DatePicker
  ...
  preventOpenOnFocus={true}
/>