Simple form to integrate

JavaScript
1

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>

2

There are a couple of things i want to clear up before i get to the example below…

  1. Before i started working on the JavaScript i noticed the code is very inconsistent, the code didn’t match the form fields and there is different coding patterns throughout the JavaScript which suggests to me you didn’t write any of the code.
  2. Your form would not have worked at all, i say this because all fields had invalid or mixed attributes and some had incorrect markup as far as how the elements were coded and there types were set.

Please see the below the below for the fixed and working code

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Validation using JavaScript</title>
<script type="text/javascript">
    function checkName(form) /* for real name verification */
    {
        if (form.realname.value == '')
        {
            alert('Error: Username cannot be blank!');
            form.realname.focus();
            return false;
        }
        
        return true;
    }
    
    function checkEmail(form) /* for email validation */
    {
        if (/^\\w+([\\.-]?\\w+)*@\\w+([\\.-]?\\w+)*(\\.\\w{2,3})+$/.test(form.email.value))
        {
            return true;
        }
        
        alert('Invalid E-mail Address! Please re-enter.');
        return false;
    }
    
    function validatePwd(form) /* password & retype-password verification */
    {
        var invalid = ' ', minLength = 6;
        var pw1 = form.password.value, pw2 = form.password2.value;

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

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

        if (document.form.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', phone = form.phoneno.value;
        
        if (phone == '')
        {
            alert('This field is required. Please enter phone number');
            return false;
        }
        
        if (!phone.length > 1 || phone.length < 10)
        {
            alert('Invalid phone number length! Please try again.');
            return false;
        }
        
        for (var i = 0; i < phone.length; i++)
        {
            temp = '' + phone.substring(i, i + 1);
            
            if (valid.indexOf(temp) == -1)
            {
                alert('Invalid characters in your phone. Please try again.');
                return false;
            }
        }
        
        return true;
    }
    
    function validate()
    {
        var form = document.forms['form'];
        
        if (!checkName(form) || !checkEmail(form) || !validatePwd(form) || !validPhone(form))
        {
            return false;
        }
        
        return true;
    }
</script>
</head>
<body>

<form action="" method="post" name="form" onsubmit="return validate()">
    Name: <input type="text" name="realname" size="25">
    <br>
    E-Mail: <input type="text" 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>

</body>
</html>
3

Thank you dude its much working.

4

Your welcome but you didn’t answer my questions which to me says that you did just take other peoples scripts and called them your own, as a web developer i include anyone in my project copyrights as credit deserves to go to those who help to make the web development world an easier place to join in with.

5

Certainly i am just a beginner so you cannot expect miracles from me in just 2 months i am doing on php.it will take time to develop that talent…