Home techniquesonchange on a select

onChange on a select

The problem

Users using the keyboard cannot make a selection in a select when the event on it is onChange.

To see this, try selecting the last option in the select below.

Use the tab key to naviguate and enter or space key to validate. Be careful with the keyboard trap.

You can’t ! The onChange event always reloads the page when the first option is selected.

Here are two issues:

  • the user cannot select the desired option;
  • the user is not notified of the event that will redirect him/her to another page.

A simple solution

Remove onChange event and add a submit button.