2

This is related to How is the default submit button on an HTML form determined?

In my web app's design the user should be able to directly submit the form by pressing enter in a text input, in which case, none of the buttons in that form should be submitted as they have other functions. To avoid the default button problem, I handles the keydown event and submitted the form programmatically.

When I tested this in Firefox, it seems the first button in the form is pressed on the enter key. The simple solution is to disable that button in the keydown event handler.

Chrome, however, seems to 'intelligently' choose the first non-disabled button as the default button and will submit using that button even if that button will be immediately disabled by the keydown handler.

The effect can be tested using this jsFiddle. In Firefox, after the "first" button has been disabled by the checkbox, enter press in the input will only cause one submit. In Chrome, there will always be two submits, one from keydown and the other from button press, even after both buttons have been disabled!

This forces me to either change all keydown handlers in my code to return false or handle all button clicks and check if the button is disabled. Neither seems to be good code.

Any better suggestions?

Community
  • 1
  • 1
billc.cn
  • 7,187
  • 3
  • 39
  • 79

1 Answers1

0

May be you can hook it on blur. Try this:

<input type="text" ... onblur="submit();" />
hm.
  • 166
  • 9
  • Just tried this and unfortunately it didn't work. The input is never blurred, i.e. the cursor stays in the input even though the form submit event comes from the button. As I said above, some button will be used to submit the form even if all buttons have been disabled prior to press of the enter key. – billc.cn Jun 07 '12 at 23:45