WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: WCAG – Form fields and focus reset after JavaScript jump menu

for

Number of posts in this thread: 3 (In chronological order)

From: Maupin, Brennan Polaris McCaffrey - maupinbp
Date: Tue, Mar 05 2019 7:43AM
Subject: WCAG – Form fields and focus reset after JavaScript jump menu
No previous message | Next message →

Hi all,

Hi all, I have a quick question about a website that I am looking over and wanted to see if someone could point me in the right direction.

This website uses a number of drop-down forms to reserve a room and two of them have JavaScript functions attached to dynamically control the drop-down options further down on the page (very much like WCAG SCR19-Using an onchange event on a select element without causing a change of context<https://www.w3.org/WAI/WCAG21/Techniques/client-side-script/SCR19>).

My issue with these JS functions is that sometimes when they are triggered (like if I go back and correct an earlier form,) when I press tab again, they seem to "reset" the focus back to the topmost form field.

I can see how if it *automatically* changed focus it would definitely be violating 3.2.2, but I am not sure since there is no actual shift of focus until I press tab myself. Does anyone know if this compliant with WCAG or not?

Thanks so much,
Brennan

From: Laura Fathauer
Date: Tue, Mar 05 2019 8:04AM
Subject: Re: WCAG – Form fields and focus reset after JavaScript jump menu
← Previous message | Next message →

It sounds like its losing focus when you change the element value, which I
indicate is a problem with Focus Order. Logically, after you change that
value you'd want to go to the next element, not the top of the form.

Laura


On Tue, Mar 5, 2019 at 9:44 AM Maupin, Brennan Polaris McCaffrey - maupinbp
< = EMAIL ADDRESS REMOVED = > wrote:

> Hi all,
>
> Hi all, I have a quick question about a website that I am looking over and
> wanted to see if someone could point me in the right direction.
>
> This website uses a number of drop-down forms to reserve a room and two of
> them have JavaScript functions attached to dynamically control the
> drop-down options further down on the page (very much like WCAG SCR19-Using
> an onchange event on a select element without causing a change of context<
> https://www.w3.org/WAI/WCAG21/Techniques/client-side-script/SCR19>).
>
> My issue with these JS functions is that sometimes when they are triggered
> (like if I go back and correct an earlier form,) when I press tab again,
> they seem to "reset" the focus back to the topmost form field.
>
> I can see how if it *automatically* changed focus it would definitely be
> violating 3.2.2, but I am not sure since there is no actual shift of focus
> until I press tab myself. Does anyone know if this compliant with WCAG or
> not?
>
> Thanks so much,
> Brennan
>
> > > > >

From: Maupin, Brennan Polaris McCaffrey - maupinbp
Date: Wed, Mar 06 2019 8:39AM
Subject: Re: WCAG – Form fields and focus reset after JavaScript jump menu
← Previous message | No next message

That makes perfect sense to me! Thank you for your input Laura.
-Brennan

-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Laura Fathauer
Sent: Tuesday, March 5, 2019 10:05 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] WCAG – Form fields and focus reset after JavaScript jump menu

It sounds like its losing focus when you change the element value, which I indicate is a problem with Focus Order. Logically, after you change that value you'd want to go to the next element, not the top of the form.

Laura


On Tue, Mar 5, 2019 at 9:44 AM Maupin, Brennan Polaris McCaffrey - maupinbp < = EMAIL ADDRESS REMOVED = > wrote:

> Hi all,
>
> Hi all, I have a quick question about a website that I am looking over
> and wanted to see if someone could point me in the right direction.
>
> This website uses a number of drop-down forms to reserve a room and
> two of them have JavaScript functions attached to dynamically control
> the drop-down options further down on the page (very much like WCAG
> SCR19-Using an onchange event on a select element without causing a
> change of context< https://urldefense.proofpoint.com/v2/url?u=https-3A__www.w3.org_WAI_WCAG21_Techniques_client-2Dside-2Dscript_SCR19&d=DwICAg&c=eLbWYnpnzycBCgmb7vCI4uqNEB9RSjOdn_5nBEmmeq0&r=tzjt3_Kd4qvmdydGF10YVA&m=_oa1DXQRDLxM7AMjgAqFacQkQSqLFMqW7n2ELI_Rjs0&s=NkgKcokS6DkTGeqAvXJAuzG_wH4sWm7U4nz4EVfVS3E&e=>).
>
> My issue with these JS functions is that sometimes when they are
> triggered (like if I go back and correct an earlier form,) when I
> press tab again, they seem to "reset" the focus back to the topmost form field.
>
> I can see how if it *automatically* changed focus it would definitely
> be violating 3.2.2, but I am not sure since there is no actual shift
> of focus until I press tab myself. Does anyone know if this compliant
> with WCAG or not?
>
> Thanks so much,
> Brennan
>
> > > https://urldefense.proofpoint.com/v2/url?u=http-3A__list.webaim.org_&d
> =DwICAg&c=eLbWYnpnzycBCgmb7vCI4uqNEB9RSjOdn_5nBEmmeq0&r=tzjt3_Kd4qvmdy
> dGF10YVA&m=_oa1DXQRDLxM7AMjgAqFacQkQSqLFMqW7n2ELI_Rjs0&s=Mon6XgdoGIxL4
> e2IsunrEkXqvCQQy1pvI_MREirvcTk&e= List archives at
> https://urldefense.proofpoint.com/v2/url?u=http-3A__webaim.org_discuss
> ion_archives&d=DwICAg&c=eLbWYnpnzycBCgmb7vCI4uqNEB9RSjOdn_5nBEmmeq0&r=
> tzjt3_Kd4qvmdydGF10YVA&m=_oa1DXQRDLxM7AMjgAqFacQkQSqLFMqW7n2ELI_Rjs0&s
> =90l8n2hRtPt78AzDeJX9NdSNXHtiM2HOyaUsXTv5pa0&e=
> >