I have a problem that in IE8 the enter does not work to submit a form. I have generated a test page to expose this problem. It seems that displaying the form in the onLoad
function disables results that the enter button does not trigger a submit anymore. Is this a bug in IE8 or is it some security issue?
The code to reproduce this is:
onload = function() { document.getElementById('test').style.display = 'block'; }
#test { display: none; }
<form id="test" method="get" action="javascript:alert('woei!')"> <input type="text" name="user" value=""> <input type="password" name="pw" value=""> <input type="submit" value="submit" id="submit"> </form>
To submit the form using 'Enter' button, we will use jQuery keypress() method and to check the 'Enter' button is pressed or not, we will use 'Enter' button key code value. Explanation: We use the jQuery event.
I have found a proper solution and wanted it to share with u guys.
Instead of using <input type="submit...>
, use <button type="submit"...>
. This will do exactly the same in the other browsers (IE6-7, FF3) AND works in IE8. :)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <style type="text/css"> #test { display: none; } </style> <script type="text/javascript"> onload = function() { document.getElementById('test').style.display = 'block'; }; </script> </head> <body> <form id="test" method="get" action="javascript:alert('woei!')"> <input type="text" name="user" value="" /> <input type="password" name="pw" value="" /> <button type="submit" value="submit" id="submit"></button> </form> </body> </html>
$("form input").keypress(function (e) { if(e.which === 13) { $("form").submit(); } });
Above is a proper fix. Ref: IE Not submitting my form on enter press of enter key?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With