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!

  • Congratulations MikeeOK on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Disable Enter key submission on every form. 2

Status
Not open for further replies.

j4606

MIS
Nov 28, 2005
349
US
I am working on a few forms that need to have the enter button disabled. With JavaScript I can acheieve this. The easiest example I found for disableing submission of a form when the enter button is pressed is given below.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "[URL unfurl="true"]http://www.w3.org/TR/html4/strict.dtd">[/URL]

<html>
<head>
<title>new document</title>

<script type="text/javascript">
function noenter() {
  return !(window.event && window.event.keyCode == 13); }
</script>

<style type="text/css">

</style>

</head>

<body>
<form name="f">

  <input type="text" name="t1" value="" onkeypress="return noenter()" /><br />
  <input type="text" name="t2" value="" onkeypress="return noenter()" /><br />
  <input type="text" name="t3" value="" onkeypress="return noenter()" /><br />
  <input type="text" name="t4" value="" onkeypress="return noenter()" /><br />
  <input type="text" name="t5" value="" onkeypress="return noenter()" /><br />
  <input type="text" name="t6" value="" onkeypress="return noenter()" /><br />
  <input type="submit" name="s" />
</form>
</body>

</html>

But inserting the
Code:
onkeypress="return noenter()"
into every single individual text box in the site seems unnecessarily laborious...

Is there a way I can include JavaScript in CSS documents?
Can I make it so everyone one my text boxes on any form in the website has enter disabled through CSS, or a javascript include file with out having to add
Code:
onkeypress="return noenter()"
to every single text box?

Thanks again
:>



I don't know the answer but my good friend Google does.
 
Have you tried just putting the onkeypress event in the FORM tag?

I don't know the answer to your specific question (can you put JS in CSS). I'm pretty sure the answer is 'no'.

Dave


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
O Time, Strength, Cash, and Patience! [infinity]
 
Putting the event in the form tag works. It wouldn't be very time consuming to add the event to all form tags but I am still hoping there is a lazier way of achieving this. It is a fun problem to try to fix. I'll post if I find a way around this till then I'll just use the solution given.

Thanks

I don't know the answer but my good friend Google does.
 
Well, you can write a standard JavaScript function and import it into all your files:

Code:
window.onload = disableEnter();
function disableEnter()
{
 var x = document.forms.length;
 for(var i=0; i<x; i++)
  document.forms[i].onkeypress = "return noenter();"
}

Well, this is untested, but it seems like it should work. Certainly something like this would work and it's no different than attaching a CSS file to every page. ...although it won't work for people with JavaScript disabled.

Dave


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
O Time, Strength, Cash, and Patience! [infinity]
 
Thanks for the info. I'll try to get it working.
My .js file looks like this right now
Code:
window.onload = disableEnter;
function disableEnter()
{
	var x = document.forms.length;
	for(var i=0; i<x; ++i)
	{
		document.forms[i].onkeypress="return noenter()";
		alert(document.forms[i].value);
	}
}

function noenter() 
{
	return !(window.event && window.event.keyCode == 13); 
}

and my html

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "[URL unfurl="true"]http://www.w3.org/TR/html4/strict.dtd">[/URL]

<html>
<head>
<title>new document</title>

<SCRIPT LANGUAGE="JavaScript" SRC="disableenter.js">
</SCRIPT>

<style type="text/css">

</style>

</head>

<body>
<form name="f">

  <input type="text" name="t1" value="" /><br />
  <input type="text" name="t2" value="" /><br />
  <input type="text" name="t3" value="" /><br />
  <input type="text" name="t4" value="" /><br />
  <input type="text" name="t5" value="" /><br />
  <input type="text" name="t6" value="" /><br />
  <input type="submit" name="s" />
</form>
</body>

</html>
Can't figure out where I'm going wrong. Anyway thanks for the help.

I don't know the answer but my good friend Google does.
 
My bad.

Change:

Code:
document.forms[i].onkeypress="return noenter()";
to:

Code:
document.forms[i].onkeypress=noenter;

noenter() does the necessary "return false"

Dave


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
O Time, Strength, Cash, and Patience! [infinity]
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top