Pressing Enter Key Instead of Clicking Button 1

pnjones · Jun 27, 2002

I know this question has been posed several times before, but I cannot get this to work. I am trying to allow the user to type a password, click a button called "Open" OR press the Enter key to link to another page. For simplicity I have created a page (see code below) which illustrates the idea and recreates the problem. Please try it at

http://www.jonestechnicalservices.com/testenter

using Internet Explorer. The correct password is SUCCESS.

<html>
<head>
<title>Test Using the Enter Key</title>
</head>
<body onload="setFocus();" onkeydown="keyPress();">
<form name="form">
<p>Please enter the password:
<input type="password" name="Password" size="20">
<input type="button" value="Open" name="Button" onclick="Verify();"></p>
</form>
</body>
<script LANGUAGE="JavaScript">
<!--
function setFocus() {
document.form.Password.focus();
}
function keyPress() {
if (window.event.keyCode == 13)
document.form.Button.click();
}
function Verify() {
var PageName = document.form.Password.value.toLowerCase() + ".htm";
if (PageName.length == 11) {
this.location.href(PageName);
}
else {
this.location.href("error.htm&quot

;
}
}
//-->
</script>
</html>

Here is what I have observed:

(1) Clicking the Open button always works.
(2) If I run this page from my C: drive the Enter key works fine, but if I run it from a web server, the page appears to link to itself (you can see this by clicking the browser's Back button after the response from pressing the Enter key).
(3) By placing 'alert' statements before the 'this.location.href' statements I can tell that it is recognizing that the Enter key has been pressed and is following the intended path.
(4) If I place 'alert' statements AFTER the 'this.location.href' statements it works like it is supposed to.

It almost appears to be some sort of timing problem.

Any suggestions would be appreciated.

Thanks,
Paul Jones

NEVERSLEEP · Jun 27, 2002

<html>
<head>
<title>Test Using the Enter Key</title>
<script LANGUAGE="JavaScript">
<!--
function setFocus() {
document.form.Password.focus();
}
function Verify() {
var PageName = document.form.Password.value.toLowerCase() + ".htm";
if (PageName.length == 11) {
this.location.href(PageName);
}
else {
this.location.href("error.htm&quot

;
}
}
//-->
</script>
</head>
<body onload="setFocus()">
<form name="form" onsubmit="Verify()">
<p>Please enter the password:
<input type="password" name="Password" size="20">
<input type="submit" value="Open" name="Button"></p>
</form>
</body>
</html>
---------------------------------------

someone knowledge ends where
someone else knowledge starts

jemminger · Jun 27, 2002

pnjones,

your original code works fine for me in IE 5.5.

pnjones · Jun 27, 2002

Hi Jemminger,

Did you test it locally from your hard drive or did you go to the link

http://www.jonestechnicalservices.com/testenter

? The original code does work OK when run from the hard drive but not from a web server. I have tested it with IE 5.0, 5.5, 6.0, Opera 6, Netscape 4.7, Netscape 6, and Mozilla 1.0 ... always with the same results.

NEVERSLEEP, thanks for the try. I am sure you are onto something, but I copied and pasted your code as-is and it doesn't seem work at all (Enter key or Open button). See

http://www.jonestechnicalservices.com/testenter/neversleep.htm.

Thanks,
Paul Jones

NEVERSLEEP · Jun 27, 2002

<html>
<head>
<title>Test Using the Enter Key</title>
<script LANGUAGE="JavaScript">
<!--
function Verify() {
var PageName = document.form.Password.value.toLowerCase() + ".htm";
if (PageName.length == 11) {
top.location.href(PageName);
} else {
top.location.href("error.htm&quot

;
}
}
//-->
</script>
</head>
<body onload="document.form.Password.focus()">
<form name="form" action="javascript:Verify()">
<p>Please enter the password:
<input type="password" name="Password" size="20">
<input type="submit" value="Open"></p>
</form>
</body>
</html>
---------------------------------------

someone knowledge ends where
someone else knowledge starts

christheprogrammer · Jun 27, 2002

pnjones - I tried neversleep's first solution (from your page) and it worked perfectly... ie5.5

good luck Chris says: "It's time for a beer."

pnjones · Jun 27, 2002

Thanks NEVERSLEEP,

Yes, your second version did the trick. It works in IE 5.0, 5.5, 6.0, Opera 6, Netscape 6, and Mozilla 1.0. Unfortunately in Netscape 4.7 it now doesn't respond to Enter or the Open button.

Do you have any thoughts on how to get it to work in Netscape 4? I would settle for just the Open button.

And I agree with Chris ... it is time for a beer!

Thanks again,
Paul Jones

NEVERSLEEP · Jun 27, 2002

"Do you have any thoughts on how to get it to work in Netscape 4?"

[flush] Netscrapy 4 ....sorry about that
but "works on ... not on ..." just [flame]

me
why can they make it all the same ... [curse]

what the error in netscrapy 4 ?
---------------------------------------

someone knowledge ends where
someone else knowledge starts

pnjones · Jun 27, 2002

No error in netscrapy 4. It just doesn't respond at all when you click the Open button or press the Enter key. I tried adding <b>onclick="javascript:Verify()"</b> to the submit button's <input> tag but that didn't help.

Paul Jones

jemminger · Jun 27, 2002

pnjones - used it right from your site; I used your link.

pnjones · Jun 27, 2002

I developed a workaround. It is crude but it works. I just replaced the entire <form> with JavaScript to write a different version of the form for Netscape 4. Otherwise it uses the NEVERSLEEP version:

<script LANGUAGE="JavaScript">
if ( document.layers ) {
document.writeln("<form name='form'>&quot

;
document.writeln("<p>Please enter the password:&quot

;
document.writeln("<input type='password' name='Password' size='20'>&quot

;
document.writeln("<input type='button' value='Open' onclick='javascript:Verify();'></p>&quot

;
document.writeln("</form>&quot

;
}
else {
document.writeln("<form name='form' action='javascript:Verify();'>&quot

;
document.writeln("<p>Please enter the password:&quot

;
document.writeln("<input type='password' name='Password' size='20'>&quot

;
document.writeln("<input type='submit' value='Open'></p>&quot

;
document.writeln("</form>&quot

;
}
</script>

Netscape 4 won't respond to the Enter key but it will respond to the Open button. I guess 99.9% of the user community will have the convenience of using the Enter key and if anyone complains I will just suggest an upgrade.

Thanks to all who took the time to look into my problem.

Paul Jones

pnjones · Jun 28, 2002

A FINAL WORD: After persisting a little more I was able to get the NEVERSLEEP version to work with Netscape 4 also. It just needed method="post" on the <form> tag. Everything works now, the Enter key and the Open button in all browsers (at least the ones that I have access to). Here is the final code:

<html>
<head>
<title>Test Using the Enter Key</title>
<script LANGUAGE="JavaScript">
<!--
function Verify() {
var PageName = document.form.Password.value.toLowerCase() + ".htm";
if (PageName.length == 11) {
self.location.replace(PageName);
} else {
self.location.replace("error.htm&quot

;
}
}
//-->
</script>
</head>
<body onload="document.form.Password.focus();">
<form name="form" action="javascript:Verify();" method="post">
<p>Please enter the password:
<input type="password" name="Password" size="20">
<input type="submit" value="Open"></p>
</form>
</body>
</html>

Paul Jones

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Pressing Enter Key Instead of Clicking Button 1

pnjones

Technical User

NEVERSLEEP

Programmer

jemminger

Programmer

pnjones

Technical User

NEVERSLEEP

Programmer

christheprogrammer

Programmer

pnjones

Technical User

NEVERSLEEP

Programmer

pnjones

Technical User

jemminger

Programmer

pnjones

Technical User

pnjones

Technical User

Similar threads

Part and Inventory Search

Sponsor