Crossbrowser prevention of enter key form submission?

[Sleidia]

Hello

Does anyone know a good crossbrowser script that prevents forms from being submitted by hitting enter key?

What I need is a script that makes it unnecessary to add javascript to form elements.

I've used this one but it doesn't seem to work anymore for some unknown reason :

var fnav = window.Event ? true : false;

    if (fnav) {
    
    window.captureEvents(Event.KEYDOWN);
    window.onkeydown = NetscapeEventHandler_KeyDown;
    
    } else {
    
    document.onkeydown = MicrosoftEventHandler_KeyDown;
    
    }

function NetscapeEventHandler_KeyDown(e) {

  if (e.which == 13 && e.target.type != 'textarea' && e.target.type != 'submit') { return false };
  
  return true;

}

function MicrosoftEventHandler_KeyDown() {

  if (event.keyCode == 13 && event.srcElement.type != 'textarea' && event.srcElement.type != 'submit')

return false;
return true;

}

Thanks a lot!

 

[vicvirk]

might not be the best way, but here's one way that works in FF/IE and Chrome:

<script language="javascript">
window.onload = function() {
	document.getElementById("frm").onsubmit = function() { return false; }
	document.getElementById("btnSubmit").onclick = function() { document.frm.submit(); }
}
</script>
<form action="mypage.html" name="frm" id="frm" method="get">
	<input type="text" name="tbx" id="tbx" /><br />
	<script language="javascript">
		document.write("<input type=\"button\" name=\"btnSubmit\" id=\"btnSubmit\" value=\"submit\" />");
	</script>
	<noscript>
		<input type="submit" name="btnSubmit2" id="btnSubmit2" value="Submit" />
	</noscript>
</form>

Basically, you're telling the browser to return false if the form is attempted to be submitted (i.e. enter key), but when the button is clicked force the submit - highlighting the submit button and clicking enter won't work either.

I wrote the button using JS and included the <noscript> tag so that the form is usable for browsers that have JS turned off....



--------
GOOGLE is a great resource to find answers to questions like "how do i..."

If you don't know exaclty what you want to do or what to search on, try Google Suggest:

http://www.google.com/webhp?complete=1&hl=en

--------
I have recently been semi-converted to ensuring all my code (well most of it) works in both javascript and non-javasc

 

[Sleidia]

Thanks Vic but I'm looking for a solution that won't necessite the modification of already existing forms.

I have lots of forms always with different names and the function I've been using so far was great for that.

Actually, I think that the issue is with browser detection because it's "window.captureEvents" that triggers errors in IE.

If I replace

if (fnav) {

by

if (navigator.appName != 'Microsoft Internet Explorer') {

then the function works with IE, FF and Safari but not with Opera anymore.

I know that navigator.appName isn't a bullet proof solution but it seems to work.

Anyway, I'm open to any other solution that is as handy as the one I was using before.

Thanks

 

[ggriffit]

another option could be to add a "return false" to each form via GetElementsByTagName (

http://www.w3schools.com/HTMLDOM/met_doc_getelementsbytagname.asp)

and then add an onclick event to the Submit buttons as per vicvirk's post

Greg Griffiths
Livelink Certified Developer & ECM Global Star Champion 2005 & 2006

http://www.greggriffiths.org/livelink/