When using a form with many text input, WebKit/Safari/Google Chrome submits the form when ”enter” is pressed in any input element. Even if there is no submit input element and no onclick handler registered.
See for instance this sample code:
<html> <body> <form method='POST' action='.'> <ul> <li><input type='text' name='foo' value='<?=rand()?>'/></li> <li><input type='text' name='bar' value='<?=$_POST['foo']?>'/></li> </ul> </form> </body> </html> When pressing enter in any of the two text input elements, the form is submitted.
Since I’m handling my form in JavaScript with asynchronous HTTP requests, I need to prevent this behavior. I could register a custom handler for the keypressed event to preventDefault and stopPropagation . But its seems ugly and is not really practical when new text input elements are added dynamically.
Listen for the
onsubmitevent on the form and returnfalse.