Form Validation with JavaScript

[PriteshP23]

JavaScript is not working:

// HTML

<form id="formLogin" name="formLogin" method="post" action="" onsubmit="validateForm(this) /">                   
    <div class="divLogin">
        <table>
            <tr>
                <td> Enter your Email: </td>
                <td> <input type="text" id="checkemail" name="txtEmail" required="required" autocomplete="off" /> </td>
            </tr>

            <tr>
                <td> Enter your Password:  </td>
                <td> <input type="password" id="checkpwd" name="pwd" minlength="6" required="required" autocomplete="off" /> </td>
            </tr>                
        </table>
    </div>

    <div>
        <input type="submit" class="btnLogin" value="Go" style="display:inline-block; margin-left:350px; font-weight:bold; font-size:12px;" />
    </div>

</form>  

// JS

function validateForm()
{
var checkemail=document.["formLogin"]["txtEmail"].value;
var atpos=checkemail.indexOf("@");
var dotpos=checkemail.lastIndexOf(".");
var checkpwd=document.forms["formLogin"]["pwd"].value;

if (checkemail==null)
{
    document.getElementById("checkemail").innerHTML = "Please Enter Email Address";
    return false;
}
if (checkpwd==null)
{
    document.getElementById("checkpwd").innerHTML = "Please Enter Password";
    return false;
} 

if (atpos<1 || dotpos<atpos+2 || dotpos+2>=checkemail.length)
  {
  alert("Not a valid e-mail address");
  return false;
  }

if (checkpwd==null || checkpwd=="")
  {
  alert("Password must be filled out");
  return false;
  }
}

[stbuchok]

ok, are we supposed to guess at what isn't working? Are you getting an error (if so, what is the error)? If you want help, please provide as much detail as possible so that we can help, otherwise this won't get a second look at.

[stbuchok]

line 3, why is there a slash at the end of the validateForm call?
I tend to use getElementById for grabbing controls on the page:

var checkemail=document.getElementById('checkemail').value;

also line 28 has a dot after the word document, probably shouldn't.

Without any information about what is failing or if there are any error messages, I can't help much more.

[PriteshP23]

@stbuchok

When i click on Go button, it directly redirect to that page. It is not checking the condition that i have used in javascript. There is no error message but it is not giving expected result. Line 3 and 28, i have changed, it is not producing result anymore.

Objective is it should work right from one write email, then password and click on button to submit. For the moment, it is not checking it at all.

[stbuchok]

Try something like below (I have not tested it in any way shape or form):

function validateForm(){
    var checkemail=document.getElementById('checkemail');
    var checkpwd=document.getElementById('checkpwd');
    var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    var isValid = true;

    if (checkemail.value.length == 0){
        document.getElementById("checkemail").innerHTML = "Please Enter Email Address";
        isvalid = false;
    }
    else{
        if(!re.test(checkemail.value)){
            document.getElementById("checkemail").innerHTML = "Not a valid email address.";
            isvalid = false;
        }
    }

    if (checkpwd.value.length == 0){
        document.getElementById("checkpwd").innerHTML = "Please Enter Password";
        isvalid = false;
    } 

    return isValid;
}

[PriteshP23]

@stbuchok Thanks for your code.

Well,
I rewrite my code and I think my error was giving wrong variable name and id. Now it is working...!!

// JS
    function validateForm()
    {
    var testemail=document.forms["formLogin"]["txtEmail"].value;
    var atpos=testemail.indexOf("@");
    var dotpos=testemail.lastIndexOf(".");
    if (atpos<1 || dotpos<atpos+2 || dotpos+2>=testemail.length)
      {
      alert("Enter Valid Email Address");
      return false;
      }

    var testpwd=document.forms["formLogin"]["pwd"].value;
    if (testpwd==null || testpwd=="")
      {
      alert("Password must be filled out");
      return false;
      }  
    if(testpwd.length<6)
    {
     alert("Password must be atleast 6 characters"); 
     return false;
     }
    }

  // HTML  
    <form id="formLogin" name="formLogin" method="post" action="" onsubmit="validateForm();">