react-native: returnKeyType="next" doesn't move to next TextInput anymore

React Native Version: 0.59.8 (Expo)

React Native version:
  React Native Environment Info:
    System:
      OS: Windows 7
      CPU: (2) x64 Intel(R) Core(TM) i5-4690K CPU @ 3.50GHz
      Memory: 4.53 GB / 13.75 GB
    Binaries:
      Yarn: 1.15.2 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
      npm: 6.2.0 - C:\Users\User\AppData\Roaming\npm\npm.CMD
    IDEs:
      Android Studio: Version  2.3.0.0 AI-162.3871768

Physical device, Pixel 2, running Android 9. Using Google’s GBoard.

Steps To Reproduce

Run this Expo Snack: https://snack.expo.io/S1XcHwA-H
Select the first TextInput
Press the returnKey

Describe what you expected to happen:

Previously I had no problem with returnKeyType=“next” moving to the next text field

Snack, code example, or link to a repository:

https://snack.expo.io/S1XcHwA-H (Same as above)

About this issue

Original URL
State: closed
Created 5 years ago
Reactions: 1
Comments: 21 (7 by maintainers)

Most upvoted comments

If you want to focus on the next text input, first you have to get ref of that TextInput component like this,

          ref={ref => {
            this.secondInput = ref;
          }}

Specifying returnKeyType will only change which icon will be displayed on the keyboard. To incorporate functionality you have to know when the user has submitted using onSubmitEditing.

onSubmitEditing={() => this.secondInput.focus()}

When user presses the return key it will focus on the ref you have provided i.e., secondInput.

You can refer to this snack for working example

+37

kiranjd on Jul 19, 2019

I’m reopening this because I think this is a real problem that would be great to nail down. I’d really appreciate any sort of granular bisect that showed what version this bug was introduced in.

+12

TheSavior on Nov 5, 2019

Just closes the keyboard (and that’s what it used to do as well.)

Nantris on Nov 7, 2019

Any updates here? I also remember next was working without ref , but now it doesn’t…sad

devhyunjae on Sep 22, 2020

I believe this functionality was added in this commit https://github.com/facebook/react-native/commit/dd8caf4cf21941aff5afc7e919ced58ec564f3a3 which first went out in 0.27.

I was able to get a project set up on 0.27.2 (which I’m shocked I was able to get working) and it shows the next button, but has the same problem. Are we sure this has ever worked?

If you could find a repro of this working at some point, that would be pretty helpful. 😄

TheSavior on Nov 5, 2019

Yeah, my guess is that this only changed the key type, but still required being wired up to go to the next input manually.

I don’t know of a way to implement this generically without fixing a core issue. I think having something like web / desktop’s tab support to go through focusable elements is needed and would naturally plug in here, but that is a bigger scope feature that we’ll need to prioritize down the line.

As for this issue, I’m not sure there is anything actionable here now. This unfortunately needs to be wired up manually for individual apps

TheSavior on Apr 30, 2020

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community’s attention? This issue may be closed if no further activity occurs. You may also label this issue as a “Discussion” or add it to the “Backlog” and I will leave it open. Thank you for your contributions.

stale[bot] on Apr 30, 2020

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.

stale[bot] on Oct 25, 2019

stale[bot] on Oct 18, 2019