andreaswienes andreaswienes - 22 days ago 8
iOS Question

React Native: How to select the next TextInput after pressing the "next" keyboard button?

I defined two TextInput fields as follows:

<TextInput
style = {styles.titleInput}
returnKeyType = {"next"}
autoFocus = {true}
placeholder = "Title" />
<TextInput
style = {styles.descriptionInput}
multiline = {true}
maxLength = {200}
placeholder = "Description" />


But after pressing the "next" button on my keyboard, my react-native app isn't jumping to the second TextInput field. How can I achieve that?

Thanks!

Answer

set the focus on the next text input on onSubmitEditing of the last one. Try ..

<TextInput 
  style = {styles.titleInput}
  returnKeyType = {"next"}
  autoFocus = {true}
  placeholder = "Title"
  onSubmitEditing={(event) => { 
    this.refs.SecondInput.focus(); 
  }}
/>
<TextInput
  ref='SecondInput'
  style = {styles.descriptionInput}          
  multiline = {true}
  maxLength = {200}
  placeholder = "Description" />
Comments