javascript form validation?

Question

do i need to add a variable or something? D: help, please?

 <html>
<head>
<script language="javascript" type="text/javascript">
function sub()
{
validateForm();
}
function validateForm()
{
if (document.forms.myForm.fname.value == "" || document.forms.myForm.fname.value == " ")
  {
  alert("First name must be filled out");
  }
if (document.forms.myForm.lname.value == "" || document.forms.myForm.lname.value == " ")
{
alert("Last name must be filled out");
}
else
{
window.location = "ok.html";
}
}
</script>
</head>

<body>
<form name="myForm">
First name: <input type="text" name="fname">
<br>
Last name: <input type="text" name="lname">
<br>
<input type="button" value="Submit" onclick="sub()">
</form>
</body>
</html>

ok so, my code works kind of - i'm not sure how to change that 'else' statement to get it to redirect to the next page if the forms are valid.. do i need to add a variable or...? so basically the code does what i want until you only enter the last name field then it shows the error message but it redirects still -
how do i make it so the code redirects to the success page if both of the fields are valid?

(i don't know much on javascript :/ and i know you can make it alot simplier but we HAVE to do it this way so we force the code to do it or whatever)

You could add in a few boolean variables that you set true if each condition it's true, and then check with an if statement that both are true and continue from there. That's a little drawn out though. Id give you a proper solution if I wasn't on my phone. — Brendan Lesniak
– Brendan Lesniak, Commented May 28, 2012 at 18:57

corazza · Accepted Answer · 2012-05-28 19:02:08Z

This should do the trick:

<html>
    <head>
        <script language="javascript" type="text/javascript">
            function validateForm()
            {
                var worked = true;

                if (document.forms.myForm.fname.value == "" || document.forms.myForm.fname.value == " ")
                {
                    alert("First name must be filled out");
                    worked = false;
                }
                if (document.forms.myForm.lname.value == "" || document.forms.myForm.lname.value == " ")
                {
                    alert("Last name must be filled out");
                    worked = false;
                }

                if (worked)
                {
                    window.location = "ok.html";
                }
            }
        </script>
    </head>

    <body>
        <form name="myForm">
            First name: <input type="text" name="fname">
            <br />
            Last name: <input type="text" name="lname">
            <br />

            <input type="button" value="Submit" onclick="validateForm();">
        </form>
    </body>
</html>

There are numerous ways to do this simple task, and this is how you would do it with a variable. Basically, if any of the checks fail, the variable worked is set to false (to indicate that something didn't work), and only if that variable is left intact (true), can the user proceed to the next step.

PS: ident your code (see how my code is easier to read than yours?). PPS: you definitely shouldn't rely only on JS to validate your forms, you must check it on your servers as well. Someone can easily bypass these checks, as they are only for convenience.

Collectives™ on Stack Overflow

javascript form validation?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related