I'm in the process of teaching myself Javascript. The only thing is, this first script I've written all on my own just plain old isn't working... at all. I've been sitting here for hours, going over my script again and again. I've even been using W3Schools (http://www.w3schools.com/default.asp) as a reference for everything, just to make sure I coded it all properly. But, alas... I just can't get the script to do what I want it to do.
Here's the HTML for the page:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Please enter your username and password...</title>
<style type="text/css">
body {position:absolute; text-align:center}
</style>
<script type="text/javascript">
function grantAccess() {
var username = document.getElementById("userName").value
var password = document.getElementById("passWord").value
var theusername = "John Doe"
var thepassword = "Enter"
var x = document.getElementById("accessForm")
submitOK = "true"
* if (getElementById("userName").length==0) {
alert("Please enter a valid username.")
submitOK = "false"
}
else if (getElementById("passWord").length==0) {
alert("Please enter a valid password.")
submitOK = "false"
}
else if (username != theusername || password != thepassword) {
alert("Invalid username.")
submitOK = "false"
}
else if (username == theusername && password == thepassword) {
alert("Welcome, " + username + ".")
x.action="http://webpages.charter.net/thelostnumber/home.html"
}
if (submitOK="false") {
return false
}
}
</script>
</head>
<body>
<form id="accessForm" action="" onsubmit="return grantAccess()">
Please enter your username and password.
<br />
<br />
Username: <input type="text" id="userName" size="20" />
<br />
Password: <input type="password" id="passWord" value="" size="20" />
<br />
<br />
<input type="submit" value="Submit" />
</form>
</body>
</html>
It's supposed to be my first attempt at a simple username and password login.
Here's the page, itself (http://webpages.charter.net/thelostnumber/test3.html), if you want to try it out to see how it isn't working.
The username is "John Doe", and the password is "Enter".
The asterisk in the code is the line where I get an error while testing the page in 1st Page 2000 (after I click the submit button).
The error is as follows:
An error has occured in the script on this page.
Line: 20
Char: 4
Error: Object expected
Code: 0
URL: (... I don't think the rest of it is important, as I'm sure you're familiar with the routine...)
I haven't the foggiest idea what sort of object it's expecting there...
I really have no clue why it isn't working. AFAIK, it should work just fine, right? If someone could help me out, I'd appreciate it.
I'd suggest using Opera or Firefox (or both) to test your javascript, because they give less vague error messages in their error consoles. In this case opera tells me "message: Statement on line 10: Reference to undefined variable: getElementById", which means that there's no such thing as getElementById in scope. What you're looking for is document.getElementById, it's a method of the document object rather than a global function.
I made the necessary addition, plus a few other necessary additions. I tried it in both IE and Firefox, and it works perfectly now.
Thanks. :)