Marko Mijailovic
Marko Mijailovic

Reputation: 431

React Native - Focusing on the next TextInput field

I'm getting undefined is not a function (evaluating '_this2._password.focus()') when trying to focus on the next field:

<View style={{ height: h * .13, width: w }}>
   <Kohana style={[styles.input, { backgroundColor: '#f9f5ed' }]}
           label={'Email'}
           onChangeText={(email) => this.email = email}
           iconClass={MaterialsIcon}
           iconName={'email'}
           iconColor={'#ddd'}
           iconColor={'#f4d29a'}
           keyboardType={'email-address'}
           labelStyle={[styles.inputLabel, { color: '#91627b' }]}
           inputStyle={[styles.inputInput, { color: '#91627b' }]}
           blurOnSubmit={false}
           returnKeyType={"next"}
           onSubmitEditing={(e) => {this._password.focus()}} />
</View>
<View style={{ height: h * .13, width: w }}>
   <Kohana
           style={[styles.input, { backgroundColor: '#f9f5ed' }]}
           ref={(ref) => this._password = ref}
           label={'Password'}
           onChangeText={(password) => this.password = password}
           secureTextEntry={true}
           iconClass={MaterialsIcon}
           iconName={'lock'}
           iconColor={'#ddd'}
           iconColor={'#f4d29a'}
           blurOnSubmit={true}
           labelStyle={[styles.inputLabel, { color: '#91627b' }]}
           inputStyle={[styles.inputInput, { color: '#91627b' }]}/>
</View>

I've tried other solutions, the one when you make the ref a string, and calling it like this.refs._refName.focus() and the one from Facebook, where you make the refs consecutive integers - [this][1], but none of them work.

Upvotes: 0

Views: 2017

Answers (1)

Saleel
Saleel

Reputation: 899

Focus is a method of TextInput component. However, you can add a custom focus method in your Kohana component, and call the focus of TextInput present in your component. You will have to add a reference to the TextInput to do so.

See my answer here : undefined exception while calling focus method on TextInput ref

Upvotes: 1

Related Questions