Validation concept in Javascript:
It is used to check that the entered data is correct according to format, range, and requirement.
It is also used to validate different data format using a regular expression.
When we create Login Form, a registration form or any other form then we can implement Javascript validation code which can be executed in any web browser.
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function validreg()
{
var email = document.getElementById("txtemail").value;
atpos = email.indexOf("@");
dotpos = email.lastIndexOf(".");
if(atpos==-1 || dotpos==-1 || dotpos-atpos<3 || atpos<1 || dotpos+1==email.length)
{
document.getElementById("spemail").innerHTML= "Invalid emailid";
return false;
}
if(document.getElementById("txtpass").value.length==0)
{
document.getElementById("sppass").innerHTML= "Enter password";
return false;
}
if(document.getElementById("txtcpass").value.length==0)
{
document.getElementById("spcpass").innerHTML= "Re-Enter password";
return false;
}
if(document.getElementById("txtpass").value!=document.getElementById("txtcpass").value)
{
document.getElementById("sppass").innerHTML= "password mismatch";
return false;
}
if(document.getElementById("txtmobile").value.length==0)
{
document.getElementById("spmobile").innerHTML= "mobileno is required";
return false;
}
if(isNaN(document.getElementById("txtmobile").value))
{
document.getElementById("spmobile").innerHTML= "mobileno should be numeric";
return false;
}
if(document.getElementById("txtmobile").value.length!=10)
{
document.getElementById("spmobile").innerHTML= "mobileno should be 10 digit";
return false;
}
}
</script>
</head>
<body>
<form action="Demo5.html" method="post">
<input type="text" id="txtemail" placeholder="Enter email" />
<span id="spemail"></span>
<br>
<br>
<input type="password" id="txtpass" placeholder="Enter password" />
<span id="sppass"></span>
<br>
<br>
<input type="password" id="txtcpass" placeholder="Re-Enter password" />
<span id="spcpass"></span>
<br>
<br>
<input type="text" id="txtmobile" placeholder="Enter mobileno" />
<span id="spmobile"></span>
<br>
<br>
<input type="submit" value="Register" id="btnreg" value="Register" onclick="return validreg()" />
<br>
<br>
</form>
</body>
</html>
It is also used to validate different data format using a regular expression.
When we create Login Form, a registration form or any other form then we can implement Javascript validation code which can be executed in any web browser.
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function validreg()
{
var email = document.getElementById("txtemail").value;
atpos = email.indexOf("@");
dotpos = email.lastIndexOf(".");
if(atpos==-1 || dotpos==-1 || dotpos-atpos<3 || atpos<1 || dotpos+1==email.length)
{
document.getElementById("spemail").innerHTML= "Invalid emailid";
return false;
}
if(document.getElementById("txtpass").value.length==0)
{
document.getElementById("sppass").innerHTML= "Enter password";
return false;
}
if(document.getElementById("txtcpass").value.length==0)
{
document.getElementById("spcpass").innerHTML= "Re-Enter password";
return false;
}
if(document.getElementById("txtpass").value!=document.getElementById("txtcpass").value)
{
document.getElementById("sppass").innerHTML= "password mismatch";
return false;
}
if(document.getElementById("txtmobile").value.length==0)
{
document.getElementById("spmobile").innerHTML= "mobileno is required";
return false;
}
if(isNaN(document.getElementById("txtmobile").value))
{
document.getElementById("spmobile").innerHTML= "mobileno should be numeric";
return false;
}
if(document.getElementById("txtmobile").value.length!=10)
{
document.getElementById("spmobile").innerHTML= "mobileno should be 10 digit";
return false;
}
}
</script>
</head>
<body>
<form action="Demo5.html" method="post">
<input type="text" id="txtemail" placeholder="Enter email" />
<span id="spemail"></span>
<br>
<br>
<input type="password" id="txtpass" placeholder="Enter password" />
<span id="sppass"></span>
<br>
<br>
<input type="password" id="txtcpass" placeholder="Re-Enter password" />
<span id="spcpass"></span>
<br>
<br>
<input type="text" id="txtmobile" placeholder="Enter mobileno" />
<span id="spmobile"></span>
<br>
<br>
<input type="submit" value="Register" id="btnreg" value="Register" onclick="return validreg()" />
<br>
<br>
</form>
</body>
</html>
Post a Comment
If you have any doubt in programming or join online classes then you can contact us by comment .