Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Question: how show 'next' button in number-pad TextInput #26885

Closed
saimonventura opened this issue Oct 16, 2019 · 20 comments
Closed

Question: how show 'next' button in number-pad TextInput #26885

saimonventura opened this issue Oct 16, 2019 · 20 comments
Labels
Component: Button Component: TextInput Related to the TextInput component. Ran Commands One of our bots successfully processed a command. Resolution: Locked This issue was locked by the bot. Type: Question Issues that are actually questions and not bug reports.

Comments

@saimonventura
Copy link

I have a form with some TextInputs, someone of the are number-pad.
How can I show next button with number-pad keyboard?

DONE button works fine.

<TextInput keyboardType="number-pad" returnKeyType={ 'done' } />

image

NEXT button is not visible.

<TextInput keyboardType="number-pad" returnKeyType={ 'next' } />

image

@saimonventura saimonventura added the Type: Question Issues that are actually questions and not bug reports. label Oct 16, 2019
@react-native-bot react-native-bot added Component: Button Component: TextInput Related to the TextInput component. labels Oct 16, 2019
@react-native-bot
Copy link
Collaborator

We are automatically closing this issue because it does not appear to follow any of the provided issue templates.

👉 Click here if you want to report a reproducible bug or regression in React Native.

@react-native-bot react-native-bot added Ran Commands One of our bots successfully processed a command. Resolution: No Template labels Oct 16, 2019
@stevenschmatz
Copy link

+1

@RuairiOliver
Copy link

Anyone find a solution to this?

@movie4
Copy link

movie4 commented Nov 26, 2019

(Platform.OS === 'ios') ? 'done' : 'next' — good spike 🥇

@jpamarohorta
Copy link

This still happens in 0.61.2 Is there a iOS reason for the "Next" not to appear?

@brunohkbx
Copy link
Contributor

Any updates on this?

@gsevla
Copy link

gsevla commented Jun 17, 2020

(Platform.OS === 'ios') ? 'done' : 'next' — good spike 🥇

If you use formik, done as returnKeyType dispatch handleSubmit so done is not an option.

@rafaelbpa
Copy link

rafaelbpa commented Jun 20, 2020

Why this is closed? Still a problem to me too in 0.61.5

@amirul-afk
Copy link

any solution for this? having this issue.. but closed?

@smaudd
Copy link

smaudd commented Sep 10, 2020

Same problem here. Any solution??

@ssuzzi
Copy link

ssuzzi commented Sep 14, 2020

Simply add an InputAccessoryView and bind the next input focus event to a button inside that view

@MorenoMdz
Copy link

Simply add an InputAccessoryView and bind the next input focus event to a button inside that view

I am curious about this approach, could you share a code block example? Thanks

@MorenoMdz
Copy link

MorenoMdz commented Oct 5, 2020

(Platform.OS === 'ios') ? 'done' : 'next' — good spike 🥇

If you use formik, done as returnKeyType dispatch handleSubmit so done is not an option.

Thats odd, I am trying to solve this and I am using Formik, had to create a whole class component just to hold my forms to be able to focus the next input as useRef was not working for me, and calling returnKeyType="done" in IOS goes to the next field for me, instead of submitting. I had to explicit set the last input to submit with onSubmitEditing={() => handleSubmit()}

<FormInput
  allowFontScaling={false}
  onChangeText={handleChange('redemptionsTotal')}
  onBlur={handleBlur('redemptionsTotal')}
  name="redemptionsTotal"
  value={values.redemptionsTotal}
  error={errors.redemptionsTotal}
  touched={touched.redemptionsTotal}
  placeholder="TOTAL"
  returnKeyType={Platform.OS === 'ios' ? 'done' : 'next'}
  blurOnSubmit={false}
  keyboardType="numeric"
  setInpRef={(inpRedeemTotal) => (this.inpRedeemTotal = inpRedeemTotal)}
  onSubmitEditing={() => this.inpRedeemUser.focus()}
  style={styles.inputShort}
/>;

@QueenTallicia69-cloud
Copy link

I have a form with some TextInputs, someone of the are number-pad.
How can I show next button with number-pad keyboard?

DONE button works fine.

<TextInput keyboardType="number-pad" returnKeyType={ 'done' } />

image

NEXT button is not visible.

<TextInput keyboardType="number-pad" returnKeyType={ 'next' } />

image

@ngocht143
Copy link

@react-native-bot Same problem here. Any solution?

@colaquecez
Copy link

Same problem here, any solution? :(

@allanzi
Copy link

allanzi commented May 6, 2021

Using 0.63 and same problem 😭

@allanzi
Copy link

allanzi commented May 6, 2021

Why it's closed?

@henrymoulton
Copy link
Contributor

Still an issue, why is this closed?

@Hustenbonbon
Copy link

I created a new issue that follows the template, maybe this will be looked at. Please upvote the new issue if you want this bug to be solved: #31794

@facebook facebook locked as resolved and limited conversation to collaborators Oct 3, 2021
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Oct 3, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Component: Button Component: TextInput Related to the TextInput component. Ran Commands One of our bots successfully processed a command. Resolution: Locked This issue was locked by the bot. Type: Question Issues that are actually questions and not bug reports.
Projects
None yet
Development

No branches or pull requests