enter key integration [Archive]

View Full Version : enter key integration

F.N.G.

01-30-2003, 03:52 AM

Hi,

Can anyone show me how to get the "enter" key
to fire the 'GoTo()' function, in the following script?

<HTML>
<HEAD>

<SCRIPT type=text/javascript>

function GoTo()

{ var FileName;

FileName = document.form.input.value

{

var location=('folder/' + FileName + '.html');
this.location.href = location;

}
}
</SCRIPT>

</HEAD>
<BODY onLoad='document.form.input.focus()'>

<FORM name=form>

<INPUT name=input type=text>

<INPUT type=button value=GO onclick='GoTo()'>

</FORM>

</BODY>
</HTML>

cg9com

01-30-2003, 04:07 AM

this should work

if(window.event.keyCode==13)
{GoTo();}

F.N.G.

01-30-2003, 04:30 AM

Ok, I tried that, and when I hit "enter", I get a blank page...

For example, if I type "index" into the text field, and click the "GO" button, that page comes up, and the address bar shows '... /folder/index.html '

however, if type "index", and hit the "enter" key, I get a blank page, and the address bar shows '... ?input=index ' :confused:

Mhtml

01-30-2003, 12:35 PM

You are submitting a form, the default method is get so that is why your address is changing.

Take out the form tags. They are not needed. Then you can just call the element by itself.

If you ask me you are trying to make something more complex then is needed.

brothercake

01-30-2003, 01:17 PM

*don't* take out the form tags, they are needed, or the form won't show up at all in some browsers.

If you have a form which contains a SUBMIT button, then pressing enter will submit the form; you can trap the onsubmit event, and do something else with it. So

<input type="submit" value="GO">

and

<form onsubmit="return GoTo()">

Then in your function, you have to return false, to prevent the form from being submitted.

You also have an unecessary braced-section in your function, and you shouldn't use reserved words as variables names = you shouldn't have a form called "form" or an input called "input" and you definitely cannot have a variable called "location".

Here's the whole thing:

<html><head></head>

<body>

<script type="text/javascript">

function GoTo() {

var newPage = "folder/" + document.forms.url_form.url_input.value + ".html";

document.location = newPage;

return false;
}

</script>

<form name="url_form" onsubmit="return GoTo()">
<input name="url_input" type="text">
<input type="submit" value="GO">
</form>

</body>

F.N.G.

01-30-2003, 01:52 PM

Thank you very much for both the solution, and useful information.

( I was using those names for clarity, but didn't realize doing so could cause problems. )

Mhtml

01-31-2003, 05:55 AM

*don't* take out the form tags, they are needed, or the form won't show up at all in some browsers.

Really? Well in that case completely disregard my post. Sorry about that.

What browsers would this not show up in? The list must be very short if it works in NS3. :confused:

brothercake

01-31-2003, 10:27 AM

Netscape 4 ... [surprise]

But it's a moot point - without form tags it's not a form - semantically - and probably wouldn't validate.

whammy

02-01-2003, 12:14 AM

It definitely wouldn't show up in NS 4.x at least... and it definitely wouldn't validate to ANY HTML spec. Besides, if there is no "form" object (which is basically created by the form tag), there would be no way for javascript to interact with its elements in the case something else was needed - no matter what the browser. ;)

Also, brothercake raised some good points about using reserved words, etc.

It's usually a good idea to avoid using variable names like:

form, document, id, window, name, location, etc. - anything that is part of the DOM (Document Object Model), basically.

I know Mhtml is already well aware of this, but it can't hurt to reiterate these things for visitors' benefit. You never know when a little thing that you read "somewhere" jogs your memory - it happens to me all the time and helps me to solve some problem for myself or others.

On that note, make sure you avoid naming a function the same as a variable, unless you really know about local and global scope, and how they are interpreted... I just avoid this kind of thing on principle.

Mhtml

02-01-2003, 04:46 AM

NS 4? Weird :confused:

I have tested it on NS 3.04 and it works perfectly, I mean the form displays. The script doesn't seem to work but that is to be expected.

Why would it work in 3.04 but not in a sinificantly better version like 4? Did they suddenly become strict or something?

cg9com

02-01-2003, 05:51 AM

a better question, what the @*$&% are you doing with NS3? lol

F.N.G.

02-01-2003, 11:45 AM

you shouldn't use reserved words as variables names = you shouldn't have a form called "form" or an input called "input" and you definitely cannot have a variable called "location".
____________________________________________

It's usually a good idea to avoid using variable names like:

form, document, id, window, name, location, etc. - anything that is part of the DOM (Document Object Model), basically.

Would adding a character make a sufficient difference to the browser--such as " FORM name='FORM1' "--or is that likely to cause dysfunction, as well?

brothercake

02-01-2003, 04:38 PM

Originally posted by F.N.G.
such as " FORM name='FORM1' "--or is that likely to cause dysfunction, as well?

No that's alright, but I personally like descriptive names, such as "mailForm" or "downloadOrderForm"

As for ns3/ns4 - it wouldn't be the first time I've seen something work in 3 but screwed in 4 ... I find 3 very useful to test in an environment of "no js support apart from basic forms and images, and no css"