Jump to content

Can Somebody Help Me Out

beano

By beano
in JavaScript

Recommended Posts

beano Newbie

beano

Posted
Posted

Okay so heres what i am trying to do, i am trying to get the value out of an input box, and make it so that every time the input box is changed it displays the variable that holds the value, heres my code written by me might be pretty bad but oh well i just started javascript about a week ago, and don't worry about the password thing i have an idea for that

<html><head><script type="text/javascript">var username=window.document.login.username.valuefunction test_username_var(){document.write(username);}document.cookie(dude=yeah,function login_check(){if(username="beano"){document.write("WELCOME");}}</script></head><body><script type="text/javascript">document.write(username);</script><form name="login" method="get"><input type="text" name="username" value="Username" onChange="test_username_var()"></br><input type="text" name="password" value="Password"></br><input type="button" onClick="login_check()" value="Submit"></form></body></html>

Link to comment
Share on other sites
Jesdisciple Invested Member

Jesdisciple

Posted
Posted

The fundamental problem is that your script executes before the page loads. Both HTML and JavaScript are parsed (and executed) as the browser finds them, but your script needs the whole page to have been parsed before the JS is executed.

var username=window.document.login.username.value

At this point, the browser doesn't know what window.document.login is; you should get an error. Enter the window.onload event-handler:

window.onload = function (){	var username = window.document.login.username.value}

I don't think you should get anymore errors, but this should write "undefined" because window.onload doesn't execute until the end of the document has been reached:

document.write(username);

A solution is to put this line in the event-handler:

window.onload = function (){	var username = window.document.login.username.value	document.write(username);}

Link to comment
Share on other sites
beano Newbie

beano

Posted
  • Author
Posted

so my new code should look like this?

<html><head><script type="text/javascript">window.onload = function (){	var username = window.document.login.username.value}function login_check(){if(username="beano"){document.write("WELCOME");}}</script></head><body><script type="text/javascript">document.write(username);</script><form name="login" method="get"><input type="text" name="username" value="Username" onChange="test_username_var()"></br><input type="text" name="password" value="Password"></br><input type="button" onClick="login_check()" value="Submit"></form></body></html>

what if i did this for my idea to write the current value as it changes would that work or no? because that code doesn't seem to work either

window.onload = function (){	var username = window.document.login.username.value	function test_username_var(){		   document.write(username);}}

thanks for the help, but it still won't write the value, and how would i make it so that it doesn't reload the page like it does?

Link to comment
Share on other sites
Jesdisciple Invested Member

Jesdisciple

Posted
Posted

No, that last change won't do much good, and I think the reason it does any good is too advanced to explain just yet. But I like that you're looking for something that might help; that's why I'm not just fixing the entire page and spitting it back out at you, although I'm being quite clumsy today.I was wrong about it not giving an error after the first change, but you seem to have stopped reading after "I don't think you should get anymore errors." I think the offending line is just a debugging technique, but you should know that the first call to document.write will always erase the entire page before writing anything (sorry, I should have mentioned this one earlier). So change it to an alert or, better yet, get Firebug and console.log it.Now the problem is that the username isn't accessible outside window.onload (should have mentioned it earlier too). Make it a property of window and you can get to it:

window.username = document.login.username.value;

When you get the value of a form-field, any updates to the form-field go unnoticed. But if you get the form-field itself, you can get its value later:

			window.onload = function (){				window.username = document.login.username;				alert(username.value);			}			function login_check(){				if(username.value = "beano"){					document.write("WELCOME");				}			}

Note: There's still a problem, but I want to see if you can solve it.

Link to comment
Share on other sites
beano Newbie

beano

Posted
  • Author
Posted

the problem is is that as soon as the page is finished loading it displays an alert, what i need to do is make a variable that holds information to check if the page is doen loading so stick a variable inside onLoad that declares true. so it would look like this

var load=falsefunction login_check(){		if (load=true){	   			 if(username.value = "beano"){					alert(username.value);				}		  }	  }window.onload = function (){				window.username = document.login.username;				alert(username.value);				 load=true			}					   }

wow i prefer actionscript to this even though they are hugely similiar, this should work shouldn't it but it doesn't

Link to comment
Share on other sites
Jesdisciple Invested Member

Jesdisciple

Posted
Posted

No, I can't see that change helping anything, although I can certainly be wrong...But I admit the problem I saw is a very subtle one:

				if(username.value = "beano"){					document.write("WELCOME");				}

This will first set username.value to "beano" and then test it for being set. You need one more = sign:

				if(username.value == "beano"){					document.write("WELCOME");				}

Your page will still alert "Username," but you can of course remove that alert. When you submit "beano" as the username, the script will replace your form with "WELCOME."

Link to comment
Share on other sites
jeffman w3schools Guru

jeffman

Posted
Posted

All in the spirit of learning. :) Can we PLEEEAAASE get into the 21st century and not refer to form and page elements with dot notation? I mean things like this:window.document.login.username.valueInstead, give the username element an ID (id="my_id") and reference it like this:document.getElementGetById("my_id").valueEventually, the old way is going to break, and when it does, you'll want to be doing it correctly.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...