I want validate an input form in jquery using regular expression. I have used first regular expression variable to validate first name. But I can't use any other regular expression to validate next input variable (lname, email). When I use multiple regular expressions the jquery is not working.
Here is my HTML code
<p>First Name:</p><input type="text" id="fname" placeholder="Enter your first name">
<span class= "error" id= "fnamelabel"></span>
<p class="formname">Last Name: </p><input type="text" name="lname" id="lname"class="forms" placeholder="Enter your Last name">
<span class="error" id="lnamelabel"></span>
<p class="formname">Address:</p><input type="text" name="address" id="address"class="forms" placeholder="Enter your address name">
<span class="error" id="addresslabel"></span>
<p class="formname">Email:</p><input type="text" name="email" id="email"class="forms" placeholder="Enter email address">
<span class="error" id="emaillabel"></span> // four input form
and here is my jquery code
$('document').ready(function(){
$('#sub').click(function()
{
formvalidation();
});
function formvalidation()
{
var namef = $('#fname').val();
var namel= $('#lname').val();
var address = $('#address').val();
var email= $('#email').val();
var namexP =/^([a-zA-Z ])*/;
//var countryexP= /^([a-zA-Z]+([\s-][a-zA-Z]+)$/; //here i tried to declare a regular expression
//var emailxP = /^(\w+([0-9-+.']\w+)*+\@\w+\.([\a-z]{2,3})([.]\w+))$/;
////////validation for first name
if(namef=="")
{
$('#fnamelabel').text('Enter your first name.');
$('#fname').css("border","1px solid red");
}
else if(!namexP.test(namef))
{
$('#fnamelabel').text("Letters only.")
$('#fname').css("border","1px solid red");
}
else
{
$('#fnamelabel').text('');
$('#fname').css("border","default");
}
////////validation for Last name
if(namel=="")
{
$('#lname').css("border","1px solid red");
$('#lnamelabel').text('Please enter your last name name');
}
else if(!namexP.test(namel))
{
$('#lnamelabel').text("Letters only");
$('#lname').css("border","1px solid red");
}
else
{
$('#lname').css("border","default");
$('#lnamelabel').text('');
}
////////validation for Address
if(address == "")
{
$('#address').css("border","1px solid red");
$('#addresslabel').text('Please enter your address');
}
else
{
$('#address').css("border","default");
$('#addresslabel').text('');
}
//namexP= /^([a-zA-Z]+([\s-][a-zA-Z]+)$/;
if(email == "")
{
$('#email').css("border","1px solid red");
$('#emaillabel').text('Please enter your email');
}
//here I also tried to direct matching method
/*else if(email.!match(/^(\w+([0-9-+.']\w+)*+\@\w+\.([\a-z]{2,3})([.]\w+))/))
{
$('#email').css("border","1px solid red");
$('#emaillabel').text('Please enter a valid email address someone@____.com');
}*/
else
{
$('#email').css("border","default");
$('#emaillabel').text('');
}
return false;
});
All I have tried is not working. So Please help me. Thank you.
The correct syntax is
if (!email.match(<regexp>)) ...
not
if (email.!match(<regexp>)) ...
Actually, yo should use test
rather than match
if you just want to know if the match succeeds.
The problem is in your regular expression pattern which does validate the mail.
Use this pattern to validate your email address.
var emailPattern = /^(([^<>()[\]\\.,;:\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,}))$/;
and validate your email like
else if(!emailPattern.test(email){
OR
else if(!email.match(emailPattern))
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.