CODEWITHSUNDEEP
iosreact-native
vijayst
vijayst

Reputation: 21826

Show keyboard programmatically using React native

How do I show Keyboard for TextInput programmatically using react native? Using a ScrollView, tapping between TextInput causes the keyboard to be dismissed. I want to show the Keyboard again using onFocus method of TextInput. Anyway to accomplish this?

Upvotes: 13

Views: 27332

Answers (3)

LHIOUI
LHIOUI

Reputation: 3337

consider have a reference of your TextInput:

    <TextInput ref={(ref)=>{this.myTextInput = ref}} />

And when you have to focus it again use : this.myTextInput.focus()

edit React16

For react16 use React.createRef to create a reference.

Upvotes: 20

Gabriel Scalici
Gabriel Scalici

Reputation: 650

Without ScrollView works only on ios. Place this component around the code you need the keyboard to appear on:

<ScrollView keyboardShouldPersistTaps='always'>
</ScrollView>

link: https://reactnative.dev/docs/scrollview#keyboardshouldpersisttaps

Upvotes: 0

Shawn
Shawn

Reputation: 939

Your ScrollView needs to include the keyboardShouldPersistTaps prop:

<ScrollView keyboardShouldPersistTaps></ScrollView>

Upvotes: 10

Related Questions