for example, While entering an email in the TextInput, it should validate and display the error message. where the entered email is valid or not
2
-
1What are you using to display the error messages and exclamation marks when input is invalid? Thx in advanceSome Juan– Some Juan2016-09-14 21:07:36 +00:00Commented Sep 14, 2016 at 21:07
-
Yeah what is the black popup prompt you are using?Khalil Khalaf– Khalil Khalaf2017-07-27 14:10:44 +00:00Commented Jul 27, 2017 at 14:10
Add a comment
|
2 Answers
You can use a regex to check if the mail entered is valid.
Regex function
validateEmail = (email) => {
var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(email);
};
Submit text input function
onSubmit = () => {
if (!this.validateEmail(this.state.text_input_email)) {
// not a valid email
} else {
// valid email
}
2 Comments
Negin
This rejex does not support : email@[123.123.123.123]
amit pandya
I need to validate without submitting the form. How can I achieve that?
You can validate your input value using onBlur event on TextInput
You can apply your regex or check conditions on this event.
Like this:
<TextInput
onBlur= () => {
//Conditions or Regex
}
/>
In your case, Regex function:
validateEmail = (email) => {
var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(email);
};
Text Input Code:
<TextInput
onBlur= () => {
if (!this.validateEmail(this.state.text_input_email)) {
// not a valid email
} else {
// valid email
}
}
/>
Comments
