simple form integrator using javascript functions

**ravi951** · 07-16-2011, 11:07 AM

hi all,
i want to create a simple form with 5 fields name, email-id,password,retype password and telephone number the conditions are name & password must be valid,password and retype password should match and phone no must be of 10 digits.
i have written functions for all this in javascript.tell me how to integrate to create a simple form with above fields.

kindly please integrate the functions and give me so that when i click submit button it should accept.

below is the function,when i click submit button if any errors found it should display or else it should accept.

<html>
<head>

<SCRIPT LANGUAGE="JavaScript">

function checkForm(form) /* for user name */
{
if(form.username.value == "")
{
alert("Error: Username cannot be blank!");
form.username.focus();
return false;
}
}

function checkEmail(myForm) /* for email validation*/
{
if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(myForm.emailAddr.value))
{
return (true)
}
alert("Invalid E-mail Address! Please re-enter.")
return (false)
}

function validatePwd() /*password & retype-password verification*/
{
var invalid = " ";
var minLength = 6;
var pw1 = document.myForm.password.value;
var pw2 = document.myForm.password2.value;

if (pw1 == '' || pw2 == '')
{
alert('Please enter your password twice.');
return false;
}

if (document.myForm.password.value.length < minLength) {
alert('Your password must be at least ' + minLength + ' characters long. Try again.');
return false;
}

if (document.myForm.password.value.indexOf(invalid) > -1)
{
alert("Sorry, spaces are not allowed.");
return false;
}
else
{
if (pw1 != pw2)
{
alert ("You did not enter the same new password twice. Please re-enter your password.");
return false;
}
else
{
alert('Nice job.');
return true;
}
}
}

function ValidPhone(aphone) /* phone no validation */
{
var valid = "0123456789";
if(aphone=="")
{
alert ("This field is required. Please enter phone number");
return false;
}
if(aphone.length !=10)
{
alert("Invalid phone number length! Please try again.");
return false;
}
for (var i=0; i < aphone.length; i++)
{
temp = "" + aphone.substring(i, i+1);
if (valid.indexOf(temp) == "-1")
{
alert("Invalid characters in your phone. Please try again.");
return false;
}
}
return true;
}

</script>
</HEAD>
<BODY>
<form name=myForm onSubmit="return validatePwd()">
Name:<input type=name name=name size="25">
<br>
E-Mail:<input type=email name=email size="25">
<br>
Password: <input type=password name=password maxlength=12 size="25">
<br>
Retype password: <input type=password name=password2 maxlength=12 size="25">
<br>
PhoneNo:<input type=phoneno name=phoneno maxlength=10 size="25">
<br>
<input type=submit value="Submit">
</form>
</html>

**vwphillips** · 07-16-2011, 03:56 PM

Code:

<html>
<head>

<SCRIPT LANGUAGE="JavaScript">

function checkForm(form){ /* for user name */
 var pass=true;
 if (!checkName(form)){
  pass=false;
 }
 if (!checkEmail(form)){
  pass=false;
 }
 if (!validatePwd(form)){
  pass=false;
 }
 if (!ValidPhone(form)){
  pass=false;
 }
 return pass;
}

function checkName(form) /* for user name */
{
if(form.username.value == "")
{
alert("Error: Username cannot be blank!");
form.username.focus();
return false;
}
return true;
}

function checkEmail(myForm) /* for email validation*/
{
if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(myForm.emailAddr.value))
{
return (true)
}
alert("Invalid E-mail Address! Please re-enter.")
return (false)
}

function validatePwd() /*password & retype-password verification*/
{
var invalid = " ";
var minLength = 6;
var pw1 = document.myForm.password.value;
var pw2 = document.myForm.password2.value;

if (pw1 == '' || pw2 == '')
{
alert('Please enter your password twice.');
return false;
}

if (document.myForm.password.value.length < minLength) {
alert('Your password must be at least ' + minLength + ' characters long. Try again.');
return false;
}

if (document.myForm.password.value.indexOf(invalid) > -1)
{
alert("Sorry, spaces are not allowed.");
return false;
}
else
{
if (pw1 != pw2)
{
alert ("You did not enter the same new password twice. Please re-enter your password.");
return false;
}
else
{
alert('Nice job.');
return true;
}
}
}

function ValidPhone(form) /* phone no validation */
{
var valid = "0123456789",aphone=form.phoneno.value;
if(aphone=="")
{
alert ("This field is required. Please enter phone number");
return false;
}
if(aphone.length !=10)
{
alert("Invalid phone number length! Please try again.");
return false;
}
for (var i=0; i < aphone.length; i++)
{
temp = "" + aphone.substring(i, i+1);
if (valid.indexOf(temp) == "-1")
{
alert("Invalid characters in your phone. Please try again.");
return false;
}
}
return true;
}

</script>
</HEAD>
<BODY>
<form name=myForm onSubmit="return checkForm(this)">
Name:<input type=text name=username size="25">
<br>
E-Mail:<input type=email name=emailAddr size="25">
<br>
Password: <input type=password name=password maxlength=12 size="25">
<br>
Retype password: <input type=password name=password2 maxlength=12 size="25">
<br>
PhoneNo:<input type=phoneno name=phoneno maxlength=10 size="25">
<br>
<input type=submit value="Submit">
</form>
</html>

no time to check the password code

Thread: simple form integrator using javascript functions

Thread Tools

Search Thread

simple form integrator using javascript functions

Bookmarks

Bookmarks

Posting Permissions