button type=button can be important

While dealing with a bizarre MS edge/ie bug I found how important defining the type of your buttons can be.
Scenario:
In MS edge when hitting return while focused on and text input field, the submit event would fail to fire for the correct submit button. Instead it would find the next enabled button (in this case the cancel button) and fire that event. Not ideal.

Specific Issue:
Form with both an input type=submit and a button with no defined type for canceling.
Input type=submit is initially set with a disabled attribute of true.

I found that if this submit input was not disabled submitting via enter key behaved as expected.
But as soon as the submit input was disabled any button after the disabled submit input would receive the event.

Applying the type=button to the cancel button allowed me to keep the type=submit input disabled and still prevent behavior from the cancel button.

While one could argue this is bad markup, all other browsers were able to suck it up and behave normally.

Leave a Reply

Your email address will not be published. Required fields are marked *