xgfe / react-native-datepicker

react native datePicker component for both Android and IOS, useing DatePikcerAndroid, TimePickerAndroid and DatePickerIOS
MIT License
2.12k stars 726 forks source link

No focus possible after user picks up a date #328

Open ghost opened 5 years ago

ghost commented 5 years ago

Issue

I have a form and I am using the datepicker for one of the fields. I would like to focus on the next element (which is a TextInput) and show up the keyboard after the user sets a date and click "Ok". Currently the focus is passed correctly but the keyboard won't pop up.

Expected Behavior

When calling the focus function inside the onCloseModal property the focus is correctly passed to the next element when the user hits the "Cancel" button.

When calling the focus function at the end of the code executed in the onDateChange property, the focus is correctly put on the next element but it doesn't pop up the keyboard.

Code

import DatePicker from 'react-native-datepicker';

...

<DatePicker
     style={{ width: "100%" }}
     date={this.state.date}
     mode="date"
     format="DD-MM-YYYY"
     minDate="01-01-1900"
     maxDate={new Date()}
     confirmBtnText="Confirm"
     cancelBtnText="Cancel"
     placeholder="Select date"
     onDateChange={(date) => { this.setState({date: date}); this.props.nextElementR.focus(); }}
     onCloseModal={this.props.onSubmitEditing}
/>

onSubmitEditing is a property passed from a component above which looks like the following: onSubmitEditing={() => this.inputR.email.focus()}

nextElementR is a property passed from a component above which looks like the following: nextElementR={this.inputR.email}

Environment

  1. react-native -v: 2.0.1
  2. node -v: 10.15.1
  3. npm -v: 6.4.1
  4. target platform: Android | iOS
  5. operating system: Windows 10