How do I get data from HTML form

**RustyC** · 05-09-2012 08:19 PM

We were givent the following DOM problem where we have to take the emai and password and if it is correct sent it to a website if wrong have it state bad email or password. My question is how do I get the data that is enterd into the form? do I have to use a oneclick to have it call the valid login function? Thanks.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>DOM problem</title>
<meta name="author" content="unknown">
<style type="text/css">

body {
background-color: gray;
font-family: Tahoma, sans-serif;
}

fieldset {
width: 44em;
background-color: olive;
color: white;
font-family: Tahoma, sans-serif;
}

label {
margin-top: 1em;
margin-right: 0.5em;
width: 4em;
float: left;
text-align: right;
display: block;
}

input {
margin-top: 1em;
}

textarea {
margin-top: 1em;
width: 40em;
height: 4em;
padding: 1em;
border: none;
overflow: hidden;
background-color: olive;
color: white;
font-family: Tahoma, sans-serif;
}

.loginbutton {
margin-top: 1em;
margin-left: 5.5em;
}

</style>

<script type=text/javascript>

</script>

</head>

<body>

<form name='loginForm'>

<fieldset>
<legend>please login</legend>
<label>email</label> <input type="text" name="email" id="email" size="30" /><br/>
<label>password</label> <input type="password" name="passwd" id="passwd" size="30" /><br/>
<input type="button" name="login" id="login" value= "login" class="loginbutton" /><br/>
<textarea name="messageArea" id="messageArea" rows="2" cols="40"></textarea>
</fieldset>

</form>

<script>
</script>
</body>
</html>

**LutinFou** · 05-10-2012 02:01 AM

Hi,

you will need to "submit" the information (i.e. using <input type="submit" etc.../> button) and then in the form tag use an onsubmit event handler to run the validation functions.

Hope this helps
LF

**RustyC** · 05-10-2012 07:22 AM

LF thanks for pointing me in the direction I need to go.

Rusty

**TheAliveWinner** · 05-10-2012 12:44 PM

See this:

HTML Code:

<!doctype html>
<html>
<body>
    <form name="_form" action="#" method="post" onsubmit="return Check()">
        <label>Email ID:</label> <input type="email" name="_email" /> <br/>
        <label>Password:</label> <input type="password" name="_pwd" /> <br/>
        <input type="submit" value="Log in" />
    </form>
    
    <script>
        var Check = function () {
            var eList = ['a@a.com', 'b@b.com', 'v@v.com'];
            var pList = ['aa', 'bb', 'vv'];
        
            var email = document.forms['_form'].elements['_email'].value;
            var pwd = document.forms['_form'].elements['_pwd'].value;
            
            for(i=0; i<eList.length; i++) {
                if(email == eList[i]) {
                    for(j=0; j<pList.length; j++) {
                        if(pwd == pList[j]) {
                            alert('Correct feed!');
                            return true;
                            break;
                        }
                    }
                }
            }
            alert('Incorrect feed!');
            return false;
        }
    </script>
</body>
</html>

**RustyC** · 05-10-2012 02:33 PM

TAW Thanks!

Rusty

**RustyC** · 05-10-2012 02:49 PM

I am tryingn to call the isValidLogin from the
<input type="button" name="login" id="login" value= "login" class="loginbutton" /><br/>

I added <input type="button" name="login" id="login" value= "login" class="loginbutton" onclick="isValidLogin" /><br/>
but it doesn't seem to call the function. Am I missing somthing?

Thanks,

Rusty