A Pithy Guide to WCAG 2.1 & WCAG 2.2: Non-Conformance Demo 3.2.2

3.2.2 Non-Conformance Shown with Non-Technical Explanation

Does this form conform to Success Criterion 3.2.2?

W3Schools Form submit() Method, About Copyright

Selecting a radio button placed the focus here, which is an unexpected change of context (may not be visible in all browsers).

3.1.2 Non-Conformance Shown with Technical Explanation and JavaScript Coding



<fieldset>
<legend>This form does not conform to Success Criterion 3.2.2.</legend>
<form class="yesandno" id="sc322" action="#focushere">
<label for="yes">Yes</label> <input type="radio" id="yes" name="yesno" onclick="changecontext()" value="Submit form" tabindex="1">
<label for="no">No</label><input type="radio" id="no" name="yesno2" onclick="changecontext()" value="Submit form" tabindex="2">
</form>
</fieldset>


<script>
function changecontext() {
    document.getElementById("sc322").submit();
}

</script>

The onclick event should not initiate a context change.