Home Javascript Mobile Number Validation Form in JavaScript
Questions:Ask|Latest


 
 

Share on Google+Share on Google+

Mobile Number Validation Form in JavaScript

Advertisement
This tutorial will helps you how to validate a mobile number in Java Script.

Mobile Number Validation Form in JavaScript

In this example we have created a Mobile Number Validation Form that displays the Mobile Number, Phone No. and email id entered by the user. We have used Java Script to validate the Mobile Number to 10 digits and Phone Number to 10 Digits. We have also used Java Script to get the valued entered in the form and displayed it as the user clicks Submit button. If a programmer enters a wrong phone number or mobile number or enters email-id in a different format, it shows an error message and asks the user the correct phone number and email-id.

Here is the code of Mobile Number Validation Form:

<html>
<head>
<script type="text/javascript">
function validate()
{ 
if( document.mobilenumbervalidation.mobileno.value == "" ||
isNaN( document.mobilenumbervalidation.mobileno.value) ||
document.mobilenumbervalidation.mobileno.value.length != 10 )
{
alert( "Please provide a Mobile No in the format 123." );
document.mobilenumbervalidation.mobileno.focus() ;

return false;
}
if( document.mobilenumbervalidation.phoneno.value == "" ||
isNaN( document.mobilenumbervalidation.phoneno.value) ||
document.mobilenumbervalidation.phoneno.value.length != 10 )
{
alert( "Please provide a Phone No in the format 123." );
document.mobilenumbervalidation.phoneno.focus() ;
return false;
}
var email = document.mobilenumbervalidation.email_id.value;
atpos = email.indexOf("@");
dotpos = email.lastIndexOf(".");
if (email == "" || atpos < 1 || ( dotpos - atpos < 2 )) 
{
alert("Please enter correct email ID");
document.mobilenumbervalidation.email_id.focus() ;
return false;
}

return( true );
}
</script>
</head>
<br/>
<h2 align="center">Mobile Number validation Form</h2>
<form method="get" action="show.html" name="mobilenumbervalidation" onsubmit="return(validate());">

<table border="1" bgcolor="#585858" width="20%" align="center">
<tr>
<td>MobileNo</td>
<td><input type="text" name="mobileno" id="mobileno" size="30"></td>
</tr>
<tr>
<td>Phone No</td>
<td><input type="text" name="phoneno" id="phoneno" size="30"></td>
</tr>
<tr>
<td>Email_id</td>
<td><input type="text" name="email_id" id="email_id" size="30"></td>
</tr>
<tr>
<td></td>
<td align="center"><input type="submit" value="submit"></td>
</tr>
</table>
</form>
</html>

Code to display the values entered in the Mobile Number Validation form:

<html>
<script LANGUAGE="JavaScript">
function getParams() {
var idx = document.URL.indexOf('?');
var params = new Array();
if (idx != -1) {
var pairs = document.URL.substring(idx + 1, document.URL.length)
.split('&');
for ( var i = 0; i < pairs.length; i++) {
nameVal = pairs[i].split('=');
params[nameVal[0]] = nameVal[1];
}
}
return params;
}
params = getParams();


mobileno = (params["mobileno"]);
phoneno = unescape(params["phoneno"]);
email_id = unescape(params["email_id"]);
document.write("mobileno = " + mobileno + "<br>");
document.write("phoneno = " + phoneno + "<br>");
document.write("email_id = " + email_id+ "<br>");
</script>
</html>

When you execute this program then output will be as follows:

After clicking on submit button then "show.html" will display the details as shown below:

Download Source Code

Advertisements

Liked it!  Share this Tutorial


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: July 4, 2013

Ask Questions?    Discuss: Mobile Number Validation Form in JavaScript  

Post your Comment


Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
 
 
Comments
DMCA.com