Textinput minimum length React native

Question

Is there a way to limit the textinput between a minimum length and maximum length. Suppose I want to limit the textinput length between 5 and 15, how do I do that ?

Solution

Consider adding the following code in your component:

<TextInput onTextChange={this.onTextChange} maxLength={15} ... />
<Button onPress={this.onPress} ... >Submit</Button>

onTextChange = text => {
   this.setState({text : text});
}

onPress = () => {
   const {text} = this.state;

   if(text.length < 5) {
      console.log('Your text is less than what is required.');
   }
}

Comments

[arjayosma]

when will the checking happen? during text change? during submit? or during component mount? for max, there's a maxLength prop for TextInput components... (facebook.github.io/react-native/docs/textinput#maxlength)

[Vinay N]

There is a prompt on button click where user can input an alphanumeric serial code , that code should be either 5-15 in length. And in that prompt there is an OK button, on button click I need to validate it whether the entered input is alphanumeric and is in length.

[Andreas]

Then what's preventing you from implementing that? You could get the text and check whether the length is within that range. Or you could implement the maxLength prop and only check for minimum length

[Vinay N]

How to check only that min length ?