I'm building an HTML multiple-choice quiz and am aware of a technique which would let me use multiple submit buttons - one for each answer to an individual question. I could then process the form in PHP using submit button values and determine which answer the user has selected. The reason for using submit buttons is so that they can be styled appropriately.
However, I'm wondering if this is bad practice from an accessibility perspective? Would it be better to use an individual form for each answer to a question? There are plenty of questions on here about how to use multiple submit buttons but they don't seem to address this point.
It's absolutely fine, and in a lot of cases can improve the usability of a form. Be careful however, as there are a couple of gotchas:
If the enter key is used to submit the form, the submit behaviour is undefined. HTML5 does define this behaviour, and it specifies what most browsers already do in this situation: The first submit button in the form should have its name/value sent as part of the submission.
However IE<=8 don't send the name/value pair for any submit button when the enter key is used to submit the form.
So, you have to be aware that there needs to be a "default" action for the form, and that has to be the first submit element present.
You can't use this technique to submit to a different action based on which button was pressed. Javascript can theoretically solve this, but you shouldn't do that (a good mantra is, don't use Javascript to solve a non-Javascript problem)
What will you do if the form is submitted using the Enter key on the keyboard, and none of the submit buttons is in the data you receive server-side?
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