<TextInput keyboardType="numeric"/> is not working in react native
14,832
Solution 1
<TextInput value={this.state.mobileNumber}
returnKeyType={'next'}
keyboardType={'phone-pad'}
onChangeText={(mobileNumber) => this.setState({mobileNumber})}
style={[styles.input]}
/>
Solution 2
keyboardType="numeric" does work for me on react-native 0.46.3 on both Android and iOS.
Are you sure using an alphabetical placeholder ("number") is not the cause of the issue?
This is my relevant code:
<TextInput
editable={!this.state.user.logged}
onChangeText={(mobileNumber) => this.setState({mobileNumber})}
placeholder={I18n.t('MobileNumber')}
ref='mobileNumber'
returnKeyType={(Platform.OS === 'ios') ? 'done' : 'next'}
placeholder={I18n.t('MobileNumber')}
style={styles.inputText}
underlineColorAndroid='rgba(0,0,0,0)'
value={this.state.mobileNumber}
keyboardType="numeric"
/>
Solution 3
its working for me keyboardType='numeric'
Related videos on Youtube
Author by
vasavi
Updated on September 14, 2022Comments
-
vasavi over 1 year
Here is my instance
var LoginPopup=React.createClass({ render:function(){ return( <View> <TextInput placeholder="number" keyboardType="numeric"/> <TextInput placeholder="url" keyboardType="url"/> </View> ) } })
In this component any type of keyboardType is not working(like number,url, email-address,number-pad,phone-pad etc ,)
-
C.P. over 8 yearsI am facing same problem in android. @Chirag - I think 'vasavi' is referring to a problem that - keyboardType="numeric" opens up the keyboard which has characters too. Ideally it should open a keyboard with numbers only. We have such keyboard in android.
-
-
Sulthan about 6 yearsUh, why should placeholder affect the keyboard in any way?
-
MarcoS about 6 yearsI just suppose a string value could change the type of the TextInput...
-
Devansh sadhotra over 4 yearsit doesn't show 'next' key in ios when key board type is numeric or phone-pad
-
Charly over 4 yearson ios you have to use 'done'
returnKeyType: Platform.OS === 'ios' ? 'done' : 'next',