Level AUnderstandable
3.2.2

On Input

Changing a form field's value must not automatically do something surprising, unless you've warned people first.

In plain English

Picking an option or typing in a field should not, by itself, fire off a page change. Imagine choosing your country from a dropdown and the page instantly reloads before you have finished, or ticking a box and being whisked to a new screen. That is unpredictable, and for keyboard and screen-reader users it can be impossible to recover from.

The fix is simple: let people make their choices, then act on a real button.

Who this is for

  • Keyboard users, who move through options and cannot predict auto-actions.
  • Screen-reader users, who lose their place when the page changes silently.
  • Anyone, who finds “it did something before I was ready” frustrating.

What “good” looks like

Collect input, then change things on an explicit action.

<!-- Good: nothing happens until "Apply" -->
<select name="country">…</select>
<button type="submit">Apply</button>

<!-- Acceptable: only if clearly announced beforehand -->
<label>Country (prices update automatically when changed)</label>
<select name="country" onchange="update()">…</select>

Where stores get it wrong

Country, currency, or sort dropdowns that reload the page on change with no warning, and filters that navigate the moment a box is ticked. Catch these in a self-check; they sit alongside other predictability issues on the common failures list.

How to meet it

Techniques the W3C accepts as sufficient (summarized). Follow a link for the full method.

Frequently asked questions

What does on input require?+

Success Criterion 3.2.2 (Level A) says that changing the setting of a form control (typing in a field, picking an option, ticking a box) must not automatically cause a change of context, unless you have told the user it will happen beforehand.

How is this different from 3.2.1 On Focus?+

3.2.1 is about just focusing an element. 3.2.2 is about changing its value. Selecting an option from a menu and having the page immediately jump is the classic 3.2.2 failure.

Can I ever auto-submit on change?+

Only if you clearly warn users in advance (for example, a note that says 'selecting a country updates prices automatically'). Otherwise, use a visible submit or apply button so the change happens on a deliberate action.

Reference

This is a plain-language explainer. The authoritative source is the W3C Web Content Accessibility Guidelines (WCAG) 2.2.

WCAG 2.2 © W3C. Excerpts are paraphrased; see the linked documents for the normative text.

Not sure if your store passes 3.2.2?

A human auditor checks this and every other criterion against your live store, and documents the result.

Book an audit