www.webdeveloper.com
Results 1 to 3 of 3

Thread: Need Help - Form Validation

  1. #1
    Join Date
    Apr 2013
    Posts
    3

    Question Need Help - Form Validation

    Friends,
    I am new to javascript and currently i m wrking with form validation. I facing breaks in that I want to show warning message when a user lefts name field as empty. This works good but when i want to move to next field still the warning message is displaying even though the field filled with text value:confused:. Here is my code. Please help me with ur ideas.

    type="text/javascript">

    function validate_form()
    {
    var a=document.forms["form1"]["fname"].value;
    var b=document.forms["form1"]["lname"].value;
    var search = -1;
    var temp;

    if(a.trim().length==0)
    {
    document.getElementById("f_name").innerHTML="* Field is empty";
    }

    else if(search!=a.search(" "))
    {
    document.getElementById("f_name").innerHTML="* Please enter your first name without spaces";
    }

    else if(b.trim().length==0)
    {
    document.getElementById("l_name").innerHTML="* Field is empty";
    }

    else if(search!=a.search(" "))
    {
    document.getElementById("l_name").innerHTML="* Please enter your last name without spaces";
    }

    else
    {
    alert("Thanks");
    }

    }
    </script>


    <style type="text/css"></style></head>
    <body>



    <form id="form1">
    First Name*<input type="text" name="fname" id="fname"> <span id="f_name" style="color:red"></span> </br>

    Last Name*<input type="text" id="lname"><span id="l_name" style="color:red"></span></br>


    email&nbsp&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="email" id="email"><span name="e_mail"></span></br>

    New Password <input type="password" id="pwd"><span name="pwd1"></span></br>

    Confirm Password<input type="password" id="conf_pwd"><span name="pwd2"></span></br>

    <input type="button" id="button" value="submit" onclick="validate_form()" style="

    </form>

  2. #2
    Join Date
    Apr 2013
    Posts
    3
    needed Help Please...

  3. #3
    Join Date
    Apr 2013
    Posts
    3

    Cool Need ideas to reduce code for my form validation :-)

    Finally, I have done with my code as far as i know, Please give your ideas to reduce this code....

    <html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

    <script type="text/javascript">

    function validate_form()
    {
    var a=document.forms["form1"]["fname"].value;
    var b=document.forms["form1"]["lname"].value;
    var c=document.forms["form1"]["email"].value;
    var d=document.forms["form1"]["pwd"].value;
    var e=document.forms["form1"]["conf_pwd"].value;

    var search = -1;
    var temp;
    var email_pat = false;

    var email1 = new RegExp("test@gmail.com");

    if(a.trim().length==0)
    {
    document.getElementById("f_name").innerHTML="* Field is empty";
    document.getElementById("fname").focus();
    }

    else if(search!=a.search(" "))
    {
    document.getElementById("f_name").innerHTML="";
    document.getElementById("f_name").innerHTML="* Please enter your first name without spaces";
    document.getElementById("fname").focus();
    }

    else if(b.trim().length==0)
    {
    document.getElementById("f_name").innerHTML="";
    document.getElementById("l_name").innerHTML="* Field is empty";
    document.getElementById("lname").focus();
    }

    else if(search!=b.search(" "))
    {
    document.getElementById("l_name").innerHTML="";
    document.getElementById("l_name").innerHTML="*Please enter your last name without spaces";
    document.getElementById("lname").focus();
    }

    else if(email_pat==email1.test(c) || c == "")
    {
    document.getElementById("l_name").innerHTML="";
    document.getElementById("email").focus();
    document.getElementById("e_mail").innerHTML="*Please enter proper email address";
    }

    else if(d.trim().length==0 || e.trim().lenght==0)
    {
    document.getElementById("pwd1").innerHTML="Please set your password";
    document.getElementById("pwd2").innerHTML="please set your password";
    document.getElementById("pwd").focus();
    }

    else if(d!=e)
    {
    document.getElementById("pwd2").innerHTML="";
    document.getElementById("pwd1").innerHTML="Password does not match";
    document.getElementById("pwd").focus();
    }
    else
    {
    document.getElementById("e_mail").innerHTML="";
    document.getElementById("l_name").innerHTML="";
    document.getElementById("f_name").innerHTML="";
    document.getElementById("pwd1").innerHTML="";
    document.getElementById("pwd2").innerHTML="";
    alert("Thanks");
    }

    }


    </script>

    <style type="text/css"></style></head>
    <body>



    <form id="form1">
    First Name*<input type="text" name="fname" id="fname" > <span class ="form_span" id="f_name" style="color:red"></span> </br>

    Last Name*<input type="text" id="lname"><span id="l_name" style="color:red"></span></br>


    email&nbsp&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="email" id="email"> <span id="e_mail" style="color:red"></span> </br>

    New Password<input type="password" id="pwd"><span id="pwd1" style="color:red"></span></br>

    Confirm Password<input type="password" id="conf_pwd"><span id="pwd2" style="color:red"></span></br>

    <input type="button" id="button" value="submit" onclick="validate_form()">

    </form>

    </body></html>

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles