I am creating a quiz and one of the questions needs to have a list of options for the user to select one. But also, if the answer is not in the options, I need to allow the user the write the answer in using a text input.
At the moment I have a list of radio buttons like so:
() Option 1
() Option 2
...
() Option 10
() Option 11
() Option not listed
[Next button]
When the 'Option not listed' radio button is selected - a text box is shown where the user can enter their answer. Like so:
() Option 1
() Option 2
...
() Option 10
() Option 11
(*) Option not listed
[Enter answer here (text input)]
[Next button]
The text box is then hidden if one of the other options are selected.
While radio buttons seem like an obvious choice, my problem with this approach is that the user has to click twice to make their selection (selecting an option, then selecting the next button).
However, if the options are converted to buttons, they can simply select the relevant option and it will take them to the next question. The problem with this approach is the text input option seems a little disjointed. Like so:
[Option 1]
[Option 2]
...
[Option 10]
[Option 11]
If your answer is not listed, enter it here:
[(text input)]
[Next button]
Are there any guidelines for the best approach here?
Thanks!