/    Sign up×
Community /Pin to ProfileBookmark

How do I get data from HTML form

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>
<!–

var logins = [‘[email protected]‘, ‘[email protected]‘, ‘[email protected]‘];
var passwords = [‘mets86’, ‘yankee10’, ‘password’];

function isValidLogin(login, emailList, passwd, passwdList) {
for (var i=0; i < emailList.length; i++)
if (login == emailList[i])
break;

if (i == emailList.length)
return false;
else {
if (passwd == passwdList[i])
return true;
else
return false;
}

}

//–>
</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>

to post a comment
JavaScript

6 Comments(s)

Copy linkTweet thisAlerts:
@LutinFouMay 10.2012 — 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
Copy linkTweet thisAlerts:
@RustyCauthorMay 10.2012 — LF thanks for pointing me in the direction I need to go.

Rusty
Copy linkTweet thisAlerts:
@TheAliveWinnerMay 10.2012 — [I]See this:[/I]
[code=html]
<!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 = ['[email protected]', '[email protected]', '[email protected]'];
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>
[/code]
Copy linkTweet thisAlerts:
@RustyCauthorMay 10.2012 — TAW Thanks!

Rusty
Copy linkTweet thisAlerts:
@RustyCauthorMay 10.2012 — 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
Copy linkTweet thisAlerts:
@xelawhoMay 10.2012 — Am I missing somthing?[/QUOTE]
just a couple of brackets ?

[CODE]onclick="isValidLogin()"[/CODE]
×

Success!

Help @RustyC spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.25,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...