JavaScript not executing with form validation

Question

I am relatively new to web development and I'm trying to do some form validation with javascript but my javascript block is not executing and I really don't know why. Any ideas?

<html>
<head>
    <title>Login</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link type = "text/css" rel = "stylesheet" href = "formato.css" />
    <script type = "text/javascript">
        function validate(){
            var x = document.forms[LoginInformation][username].value;
            var y = document.forms[LoginInformation][password].value;
            if(document.LoginInformation){
                alert("Enter a username");
                return false;
            }
            if(y===null || x ===""){
                alert("Enter a password");
                return false;
            }
        }
    </script>
</head>
<body>
    <center>
        <div id = "login">

        <form method = "post" name = "LoginInformation" onsubmit = "return (validate());" action="./TestLogin">
            <fieldset>
                <legend>Informaci&oacute;n de Login</legend>
                <label>Usuario:<br />
                <input type="text" name="username" size ="15"/></label><br /> 
                <label>Contrase&ntilde;a:<br />
                <input type="password" name="password" size ="15"/></label><br />
                <label><br /><input type = "submit" name = "login" value = "Login"/></label><br />
            </fieldset>
        </form>
        </div>
    </center>
</body>

the very first thing to try when debugging JavaScript is to have your browser's developer console open. Hit F12 in Chrome or Firefox to pop it up, then reload your page and perform whatever actions needed to trigger your JavaScript, and see what happens. — Dan O
– Dan O, Commented May 1, 2014 at 18:25
@orzechowskid Sorry, but what am I supposed to see? (or not to see) — Darwin57721
– Darwin57721, Commented May 1, 2014 at 18:36

Rashmin Javiya · Accepted Answer · 2014-05-01 18:28:59Z

1

Please pass the form id and control id as string as mentioned below

var x = document.forms["LoginInformation"]["username"].value; var y = document.forms["LoginInformation"]["password"].value;

answered May 1, 2014 at 18:28

Rashmin Javiya

5,2223 gold badges31 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

All Blond · Accepted Answer · 2014-05-01 18:26:31Z

0

Try this:

   <script type = "text/javascript">
    function validate(){
        var x = document.getElementbyID("username");
        var y = document.getElementbyID("password");
        if(x==""){
            alert("Enter a username");
            return false;
        }
        if(y==null || x ==""){
            alert("Enter a password");
            return false;
        }
     }
   </script>

and then all you code in between

<form method="post" name="LoginInformation" action="./TestLogin">
        <fieldset>
            <legend>Informaci&oacute;n de Login</legend>
            <label>Usuario:<br />
            <input type="text" id="username" size ="15"/></label><br /> 
            <label>Contrase&ntilde;a:<br />
            <input type="password" id="password" size ="15"/></label><br />
            <label><br /><input type ="submit" name ="login" value = "Login" onClick="validate()"/></label><br />
        </fieldset>
    </form>

answered May 1, 2014 at 18:26

All Blond

8221 gold badge8 silver badges17 bronze badges

5 Comments

Darwin57721 Over a year ago

Wow, thanks it worked. What is the difference between onClick and onsubmit?

All Blond Over a year ago

@Darwin57721 By the way what is action="./TestLogin in your form?

Darwin57721 Over a year ago

oh, that is my servlet to test that the login information is being sent correctly to the database

All Blond Over a year ago

ONClick will work for that specific control event, on submit is more complicated.Take a look at w3schools.com it may help.

All Blond Over a year ago

@Darwin57721 It is a common courtesy here to accept the answer when it was what you needed

Dan O · Accepted Answer · 2014-05-01 18:29:16Z

0

in your validate function you need to have LoginInformation, username, and password enclosed in quotation marks. If it's not, your JavaScript interpreter will consider them as regular ol' JavaScript variables, which they're not.

answered May 1, 2014 at 18:29

Dan O

6,0802 gold badges35 silver badges52 bronze badges

Collectives™ on Stack Overflow

JavaScript not executing with form validation

3 Answers 3

Comments

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related