E-mail List Archives

Thread: JAWS and disabled combobox options

for

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

From: Paul Collins
Date: Tue, Jan 10 2017 11:03PM
Subject: JAWS and disabled combobox options
No previous message | Next message

Hi friends.

I'm currently working on a project where individual options in a select box
are disabled, using the *disabled* attribute:

*<select>*
* <option>option 1</option>*
* <option disabled>option 2</option>*
*</select>*

When using the keyboard arrow keys, it skips over each disabled option.
This also means *JAWS* doesn't read out the disabled option either.

Just wondering if anyone has tackled this and how they managed to
communicate to the screen reader user that the option is there and disabled?

Thanks for any help.
Paul

From: Bryan Garaventa
Date: Wed, Jan 11 2017 1:38AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

Hi,
Actually this is an extremely bad practice and breaks not only screen reader accessibility but also keyboard accessibility, making it impossible to use single or multiple letter skipping between key sections within the select within various browsers.

This was so problematic for me at times that I created the following bookmarklet to hack this out of any web page where this was done.
http://whatsock.com/training/matrices/remove_option_disabled.htm

I sincerely suggest that nobody ever do this.



Bryan Garaventa
Accessibility Fellow
SSB BART Group, Inc.
= EMAIL ADDRESS REMOVED =
415.624.2709 (o)
www.SSBBartGroup.com

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Paul Collins
Sent: Tuesday, January 10, 2017 10:04 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] JAWS and disabled combobox options

Hi friends.

I'm currently working on a project where individual options in a select box are disabled, using the *disabled* attribute:

*<select>*
* <option>option 1</option>*
* <option disabled>option 2</option>*
*</select>*

When using the keyboard arrow keys, it skips over each disabled option.
This also means *JAWS* doesn't read out the disabled option either.

Just wondering if anyone has tackled this and how they managed to communicate to the screen reader user that the option is there and disabled?

Thanks for any help.
Paul

From: Birkir R. Gunnarsson
Date: Wed, Jan 11 2017 4:51AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

If you are implementing the combobox you could use
aria-disabled="true" to indicate that it the option is disabled (yet
it remains focusable). You'd have to use visual styling to indicate
same.



On 1/11/17, Bryan Garaventa < = EMAIL ADDRESS REMOVED = > wrote:
> Hi,
> Actually this is an extremely bad practice and breaks not only screen reader
> accessibility but also keyboard accessibility, making it impossible to use
> single or multiple letter skipping between key sections within the select
> within various browsers.
>
> This was so problematic for me at times that I created the following
> bookmarklet to hack this out of any web page where this was done.
> http://whatsock.com/training/matrices/remove_option_disabled.htm
>
> I sincerely suggest that nobody ever do this.
>
>
>
> Bryan Garaventa
> Accessibility Fellow
> SSB BART Group, Inc.
> = EMAIL ADDRESS REMOVED =
> 415.624.2709 (o)
> www.SSBBartGroup.com
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf
> Of Paul Collins
> Sent: Tuesday, January 10, 2017 10:04 PM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: [WebAIM] JAWS and disabled combobox options
>
> Hi friends.
>
> I'm currently working on a project where individual options in a select box
> are disabled, using the *disabled* attribute:
>
> *<select>*
> * <option>option 1</option>*
> * <option disabled>option 2</option>*
> *</select>*
>
> When using the keyboard arrow keys, it skips over each disabled option.
> This also means *JAWS* doesn't read out the disabled option either.
>
> Just wondering if anyone has tackled this and how they managed to
> communicate to the screen reader user that the option is there and
> disabled?
>
> Thanks for any help.
> Paul
> > > http://webaim.org/discussion/archives
> > > > > >


--
Work hard. Have fun. Make history.

From: Jonathan Avila
Date: Wed, Jan 11 2017 9:24AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

> Just wondering if anyone has tackled this and how they managed to communicate to the screen reader user that the option is there and disabled?

The support of aria-disabled doesn't seem to work correctly in my tests with IE and JAWS. But it does seem to be communicated in Firefox. You would then need to communicate somehow visually that the option was disabled as well -- perhaps with some styling?

Jonathan

Jonathan Avila
Chief Accessibility Officer
SSB BART Group
= EMAIL ADDRESS REMOVED =
703.637.8957 (Office)
Vis Visit us online: Website | Twitter | Facebook | LinkedIn | Blog
See you at CSUN in March!

The information contained in this transmission may be attorney privileged and/or confidential information intended for the use of the individual or entity named above. If the reader of this message is not the intended recipient, you are hereby notified that any use, dissemination, distribution or copying of this communication is strictly prohibited.



-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Paul Collins
Sent: Wednesday, January 11, 2017 1:04 AM
To: WebAIM Discussion List
Subject: [WebAIM] JAWS and disabled combobox options

Hi friends.

I'm currently working on a project where individual options in a select box are disabled, using the *disabled* attribute:

*<select>*
* <option>option 1</option>*
* <option disabled>option 2</option>*
*</select>*

When using the keyboard arrow keys, it skips over each disabled option.
This also means *JAWS* doesn't read out the disabled option either.

Just wondering if anyone has tackled this and how they managed to communicate to the screen reader user that the option is there and disabled?

Thanks for any help.
Paul

From: JP Jamous
Date: Wed, Jan 11 2017 9:51AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

I am following this post and thinking of it as I don't have the time to test it. I want to fall back to Windows Development for a second to address it.

When a list view or combo box loaded data from a DB, programmers and I always repopulated the items from the DB or an array in the RAM. The question becomes, why do you want to disable a dropdown item if there is no way to interact with it? Simply remove it by using style="display: none;" Problem solved.

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Jonathan Avila
Sent: Wednesday, January 11, 2017 10:24 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] JAWS and disabled combobox options

> Just wondering if anyone has tackled this and how they managed to communicate to the screen reader user that the option is there and disabled?

The support of aria-disabled doesn't seem to work correctly in my tests with IE and JAWS. But it does seem to be communicated in Firefox. You would then need to communicate somehow visually that the option was disabled as well -- perhaps with some styling?

Jonathan

Jonathan Avila
Chief Accessibility Officer
SSB BART Group
= EMAIL ADDRESS REMOVED =
703.637.8957 (Office)
Vis Visit us online: Website | Twitter | Facebook | LinkedIn | Blog See you at CSUN in March!

The information contained in this transmission may be attorney privileged and/or confidential information intended for the use of the individual or entity named above. If the reader of this message is not the intended recipient, you are hereby notified that any use, dissemination, distribution or copying of this communication is strictly prohibited.



-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Paul Collins
Sent: Wednesday, January 11, 2017 1:04 AM
To: WebAIM Discussion List
Subject: [WebAIM] JAWS and disabled combobox options

Hi friends.

I'm currently working on a project where individual options in a select box are disabled, using the *disabled* attribute:

*<select>*
* <option>option 1</option>*
* <option disabled>option 2</option>*
*</select>*

When using the keyboard arrow keys, it skips over each disabled option.
This also means *JAWS* doesn't read out the disabled option either.

Just wondering if anyone has tackled this and how they managed to communicate to the screen reader user that the option is there and disabled?

Thanks for any help.
Paul

From: Bryan Garaventa
Date: Wed, Jan 11 2017 11:33AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

Hi,
This does come up in large more complex select fields quite often, though not so much for the standard day to day usage.

Here is an example that demonstrates the scenario.

There is a select element that includes options for all of the counties in the United States, and at the start of each county list is an option element that includes the State name that this section belongs to. E.G California.

Since it's only valid to submit the field when a county is selected, but not when a State name is selected, some developers will disable the State name option element.

The result of this however is that it then makes it impossible to quickly jump to the beginning of these sections by pressing a letter such as "c" to jump to california, and it makes it impossible to even read the State name when arrowing up and down, making it impossible to determine which section you are even in.

It was this type of scenario that drove me to create the bookmarklet because dealing with this type of situation daily was driving me nuts.




Bryan Garaventa
Accessibility Fellow
SSB BART Group, Inc.
= EMAIL ADDRESS REMOVED =
415.624.2709 (o)
www.SSBBartGroup.com


-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of JP Jamous
Sent: Wednesday, January 11, 2017 8:52 AM
To: 'WebAIM Discussion List' < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] JAWS and disabled combobox options

I am following this post and thinking of it as I don't have the time to test it. I want to fall back to Windows Development for a second to address it.

When a list view or combo box loaded data from a DB, programmers and I always repopulated the items from the DB or an array in the RAM. The question becomes, why do you want to disable a dropdown item if there is no way to interact with it? Simply remove it by using style="display: none;" Problem solved.

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Jonathan Avila
Sent: Wednesday, January 11, 2017 10:24 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] JAWS and disabled combobox options

> Just wondering if anyone has tackled this and how they managed to communicate to the screen reader user that the option is there and disabled?

The support of aria-disabled doesn't seem to work correctly in my tests with IE and JAWS. But it does seem to be communicated in Firefox. You would then need to communicate somehow visually that the option was disabled as well -- perhaps with some styling?

Jonathan

Jonathan Avila
Chief Accessibility Officer
SSB BART Group
= EMAIL ADDRESS REMOVED =
703.637.8957 (Office)
Vis Visit us online: Website | Twitter | Facebook | LinkedIn | Blog See you at CSUN in March!

The information contained in this transmission may be attorney privileged and/or confidential information intended for the use of the individual or entity named above. If the reader of this message is not the intended recipient, you are hereby notified that any use, dissemination, distribution or copying of this communication is strictly prohibited.



-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Paul Collins
Sent: Wednesday, January 11, 2017 1:04 AM
To: WebAIM Discussion List
Subject: [WebAIM] JAWS and disabled combobox options

Hi friends.

I'm currently working on a project where individual options in a select box are disabled, using the *disabled* attribute:

*<select>*
* <option>option 1</option>*
* <option disabled>option 2</option>*
*</select>*

When using the keyboard arrow keys, it skips over each disabled option.
This also means *JAWS* doesn't read out the disabled option either.

Just wondering if anyone has tackled this and how they managed to communicate to the screen reader user that the option is there and disabled?

Thanks for any help.
Paul

From: JP Jamous
Date: Wed, Jan 11 2017 11:55AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

Bryan,
Do you have a page that I can check out? I am not following you, because from your description it sounded like both the States and Counties are loading in the same dropdown box, which cannot be correct.

I know I am losing you somewhere. I do understand though that when one country is selected the state item should become disabled.

Are the counties in a different dropdown or are they check boxes or radio buttons? Just trying to map out the layout in my head.

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Bryan Garaventa
Sent: Wednesday, January 11, 2017 12:33 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] JAWS and disabled combobox options

Hi,
This does come up in large more complex select fields quite often, though not so much for the standard day to day usage.

Here is an example that demonstrates the scenario.

There is a select element that includes options for all of the counties in the United States, and at the start of each county list is an option element that includes the State name that this section belongs to. E.G California.

Since it's only valid to submit the field when a county is selected, but not when a State name is selected, some developers will disable the State name option element.

The result of this however is that it then makes it impossible to quickly jump to the beginning of these sections by pressing a letter such as "c" to jump to california, and it makes it impossible to even read the State name when arrowing up and down, making it impossible to determine which section you are even in.

It was this type of scenario that drove me to create the bookmarklet because dealing with this type of situation daily was driving me nuts.




Bryan Garaventa
Accessibility Fellow
SSB BART Group, Inc.
= EMAIL ADDRESS REMOVED =
415.624.2709 (o)
www.SSBBartGroup.com


-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of JP Jamous
Sent: Wednesday, January 11, 2017 8:52 AM
To: 'WebAIM Discussion List' < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] JAWS and disabled combobox options

I am following this post and thinking of it as I don't have the time to test it. I want to fall back to Windows Development for a second to address it.

When a list view or combo box loaded data from a DB, programmers and I always repopulated the items from the DB or an array in the RAM. The question becomes, why do you want to disable a dropdown item if there is no way to interact with it? Simply remove it by using style="display: none;" Problem solved.

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Jonathan Avila
Sent: Wednesday, January 11, 2017 10:24 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] JAWS and disabled combobox options

> Just wondering if anyone has tackled this and how they managed to communicate to the screen reader user that the option is there and disabled?

The support of aria-disabled doesn't seem to work correctly in my tests with IE and JAWS. But it does seem to be communicated in Firefox. You would then need to communicate somehow visually that the option was disabled as well -- perhaps with some styling?

Jonathan

Jonathan Avila
Chief Accessibility Officer
SSB BART Group
= EMAIL ADDRESS REMOVED =
703.637.8957 (Office)
Vis Visit us online: Website | Twitter | Facebook | LinkedIn | Blog See you at CSUN in March!

The information contained in this transmission may be attorney privileged and/or confidential information intended for the use of the individual or entity named above. If the reader of this message is not the intended recipient, you are hereby notified that any use, dissemination, distribution or copying of this communication is strictly prohibited.



-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Paul Collins
Sent: Wednesday, January 11, 2017 1:04 AM
To: WebAIM Discussion List
Subject: [WebAIM] JAWS and disabled combobox options

Hi friends.

I'm currently working on a project where individual options in a select box are disabled, using the *disabled* attribute:

*<select>*
* <option>option 1</option>*
* <option disabled>option 2</option>*
*</select>*

When using the keyboard arrow keys, it skips over each disabled option.
This also means *JAWS* doesn't read out the disabled option either.

Just wondering if anyone has tackled this and how they managed to communicate to the screen reader user that the option is there and disabled?

Thanks for any help.
Paul

From: Paul Collins
Date: Wed, Jan 11 2017 9:08PM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

Hi everyone, thanks for your replies, I really appreciate your input.

Bryan, your bookmarklet is a great idea, I've saved it. The decision to
disable options in a select box was not mine, it was handed to me - I'm
working on a large scale enterprise app and as you can imagine, in these
situations accessibility is often a series of compromises between UX,
Design, Product Owners, Developers, etc to work out the best solution.

However, based on everyone's feedback, I've managed to come up with a
better solution that seems to satisfy all the stakeholders involved :)

The drop down contained a list of accounts. Some were disabled
occasionally, but we wanted to communicate which ones. I've now removed all
disabled accounts from the drop down and listed them in a descriptive
warning message, associated with the selectbox using aria-describedby.

Hope that makes sense. Thanks for your input everyone, it made me rethink
the design and come up with a better solution.

All the best,
Paul


On 12 January 2017 at 05:55, JP Jamous < = EMAIL ADDRESS REMOVED = > wrote:

> Bryan,
> Do you have a page that I can check out? I am not following you, because
> from your description it sounded like both the States and Counties are
> loading in the same dropdown box, which cannot be correct.
>
> I know I am losing you somewhere. I do understand though that when one
> country is selected the state item should become disabled.
>
> Are the counties in a different dropdown or are they check boxes or radio
> buttons? Just trying to map out the layout in my head.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Bryan Garaventa
> Sent: Wednesday, January 11, 2017 12:33 PM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> Hi,
> This does come up in large more complex select fields quite often, though
> not so much for the standard day to day usage.
>
> Here is an example that demonstrates the scenario.
>
> There is a select element that includes options for all of the counties in
> the United States, and at the start of each county list is an option
> element that includes the State name that this section belongs to. E.G
> California.
>
> Since it's only valid to submit the field when a county is selected, but
> not when a State name is selected, some developers will disable the State
> name option element.
>
> The result of this however is that it then makes it impossible to quickly
> jump to the beginning of these sections by pressing a letter such as "c" to
> jump to california, and it makes it impossible to even read the State name
> when arrowing up and down, making it impossible to determine which section
> you are even in.
>
> It was this type of scenario that drove me to create the bookmarklet
> because dealing with this type of situation daily was driving me nuts.
>
>
>
>
> Bryan Garaventa
> Accessibility Fellow
> SSB BART Group, Inc.
> = EMAIL ADDRESS REMOVED =
> 415.624.2709 (o)
> www.SSBBartGroup.com
>
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of JP Jamous
> Sent: Wednesday, January 11, 2017 8:52 AM
> To: 'WebAIM Discussion List' < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> I am following this post and thinking of it as I don't have the time to
> test it. I want to fall back to Windows Development for a second to address
> it.
>
> When a list view or combo box loaded data from a DB, programmers and I
> always repopulated the items from the DB or an array in the RAM. The
> question becomes, why do you want to disable a dropdown item if there is no
> way to interact with it? Simply remove it by using style="display: none;"
> Problem solved.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Jonathan Avila
> Sent: Wednesday, January 11, 2017 10:24 AM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> > Just wondering if anyone has tackled this and how they managed to
> communicate to the screen reader user that the option is there and disabled?
>
> The support of aria-disabled doesn't seem to work correctly in my tests
> with IE and JAWS. But it does seem to be communicated in Firefox. You
> would then need to communicate somehow visually that the option was
> disabled as well -- perhaps with some styling?
>
> Jonathan
>
> Jonathan Avila
> Chief Accessibility Officer
> SSB BART Group
> = EMAIL ADDRESS REMOVED =
> 703.637.8957 (Office)
> Vis Visit us online: Website | Twitter | Facebook | LinkedIn | Blog See
> you at CSUN in March!
>
> The information contained in this transmission may be attorney privileged
> and/or confidential information intended for the use of the individual or
> entity named above. If the reader of this message is not the intended
> recipient, you are hereby notified that any use, dissemination,
> distribution or copying of this communication is strictly prohibited.
>
>
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Paul Collins
> Sent: Wednesday, January 11, 2017 1:04 AM
> To: WebAIM Discussion List
> Subject: [WebAIM] JAWS and disabled combobox options
>
> Hi friends.
>
> I'm currently working on a project where individual options in a select
> box are disabled, using the *disabled* attribute:
>
> *<select>*
> * <option>option 1</option>*
> * <option disabled>option 2</option>*
> *</select>*
>
> When using the keyboard arrow keys, it skips over each disabled option.
> This also means *JAWS* doesn't read out the disabled option either.
>
> Just wondering if anyone has tackled this and how they managed to
> communicate to the screen reader user that the option is there and disabled?
>
> Thanks for any help.
> Paul
> > > at http://webaim.org/discussion/archives
> > > > at http://webaim.org/discussion/archives
> >
> > > at http://webaim.org/discussion/archives
> > > > at http://webaim.org/discussion/archives
> >
> > > > >

From: Bryan Garaventa
Date: Wed, Jan 11 2017 11:06PM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

No problem, happy to help. :) One note for others, the bookmarklet was simply a personal utility I created to work around some accessibility issues I was encountering, but this should not ever be part of any development strategy for making something like this accessible.

To answer a prior question from JP Jamous, the scenario described has only one select element.

E.G Example syntax:

<select title="Choose a County" >
<option >Arizona</option>
<optgroup>
<option> County Name One </option>
<option> County Name Two </option>
</optgroup>
<option >California</option>
<optgroup>
<option> County Name One </option>
<option> County Name Two </option>
</optgroup>
</select>

You can quickly jump to California by typing "cal".

However if you try the following instead, this is impossible.


<select title="Choose a County" >
<option disabled >Arizona</option>
<optgroup>
<option> County Name One </option>
<option> County Name Two </option>
</optgroup>
<option disabled >California</option>
<optgroup>
<option> County Name One </option>
<option> County Name Two </option>
</optgroup>
</select>

This is why this practice should never be done.

Instead, client side scripting should be used to check the value of such options and prevent submission if the intended value is not selected.



Bryan Garaventa
Accessibility Fellow
SSB BART Group, Inc.
= EMAIL ADDRESS REMOVED =
415.624.2709 (o)
www.SSBBartGroup.com

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Paul Collins
Sent: Wednesday, January 11, 2017 8:08 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] JAWS and disabled combobox options

Hi everyone, thanks for your replies, I really appreciate your input.

Bryan, your bookmarklet is a great idea, I've saved it. The decision to disable options in a select box was not mine, it was handed to me - I'm working on a large scale enterprise app and as you can imagine, in these situations accessibility is often a series of compromises between UX, Design, Product Owners, Developers, etc to work out the best solution.

However, based on everyone's feedback, I've managed to come up with a better solution that seems to satisfy all the stakeholders involved :)

The drop down contained a list of accounts. Some were disabled occasionally, but we wanted to communicate which ones. I've now removed all disabled accounts from the drop down and listed them in a descriptive warning message, associated with the selectbox using aria-describedby.

Hope that makes sense. Thanks for your input everyone, it made me rethink the design and come up with a better solution.

All the best,
Paul


On 12 January 2017 at 05:55, JP Jamous < = EMAIL ADDRESS REMOVED = > wrote:

> Bryan,
> Do you have a page that I can check out? I am not following you,
> because from your description it sounded like both the States and
> Counties are loading in the same dropdown box, which cannot be correct.
>
> I know I am losing you somewhere. I do understand though that when one
> country is selected the state item should become disabled.
>
> Are the counties in a different dropdown or are they check boxes or
> radio buttons? Just trying to map out the layout in my head.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Bryan Garaventa
> Sent: Wednesday, January 11, 2017 12:33 PM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> Hi,
> This does come up in large more complex select fields quite often,
> though not so much for the standard day to day usage.
>
> Here is an example that demonstrates the scenario.
>
> There is a select element that includes options for all of the
> counties in the United States, and at the start of each county list is
> an option element that includes the State name that this section
> belongs to. E.G California.
>
> Since it's only valid to submit the field when a county is selected,
> but not when a State name is selected, some developers will disable
> the State name option element.
>
> The result of this however is that it then makes it impossible to
> quickly jump to the beginning of these sections by pressing a letter
> such as "c" to jump to california, and it makes it impossible to even
> read the State name when arrowing up and down, making it impossible to
> determine which section you are even in.
>
> It was this type of scenario that drove me to create the bookmarklet
> because dealing with this type of situation daily was driving me nuts.
>
>
>
>
> Bryan Garaventa
> Accessibility Fellow
> SSB BART Group, Inc.
> = EMAIL ADDRESS REMOVED =
> 415.624.2709 (o)
> www.SSBBartGroup.com
>
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of JP Jamous
> Sent: Wednesday, January 11, 2017 8:52 AM
> To: 'WebAIM Discussion List' < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> I am following this post and thinking of it as I don't have the time
> to test it. I want to fall back to Windows Development for a second to
> address it.
>
> When a list view or combo box loaded data from a DB, programmers and I
> always repopulated the items from the DB or an array in the RAM. The
> question becomes, why do you want to disable a dropdown item if there
> is no way to interact with it? Simply remove it by using style="display: none;"
> Problem solved.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Jonathan Avila
> Sent: Wednesday, January 11, 2017 10:24 AM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> > Just wondering if anyone has tackled this and how they managed to
> communicate to the screen reader user that the option is there and disabled?
>
> The support of aria-disabled doesn't seem to work correctly in my
> tests with IE and JAWS. But it does seem to be communicated in
> Firefox. You would then need to communicate somehow visually that the
> option was disabled as well -- perhaps with some styling?
>
> Jonathan
>
> Jonathan Avila
> Chief Accessibility Officer
> SSB BART Group
> = EMAIL ADDRESS REMOVED =
> 703.637.8957 (Office)
> Vis Visit us online: Website | Twitter | Facebook | LinkedIn | Blog
> See you at CSUN in March!
>
> The information contained in this transmission may be attorney
> privileged and/or confidential information intended for the use of the
> individual or entity named above. If the reader of this message is not
> the intended recipient, you are hereby notified that any use,
> dissemination, distribution or copying of this communication is strictly prohibited.
>
>
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Paul Collins
> Sent: Wednesday, January 11, 2017 1:04 AM
> To: WebAIM Discussion List
> Subject: [WebAIM] JAWS and disabled combobox options
>
> Hi friends.
>
> I'm currently working on a project where individual options in a
> select box are disabled, using the *disabled* attribute:
>
> *<select>*
> * <option>option 1</option>*
> * <option disabled>option 2</option>*
> *</select>*
>
> When using the keyboard arrow keys, it skips over each disabled option.
> This also means *JAWS* doesn't read out the disabled option either.
>
> Just wondering if anyone has tackled this and how they managed to
> communicate to the screen reader user that the option is there and disabled?
>
> Thanks for any help.
> Paul
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >
> > > archives at http://webaim.org/discussion/archives
> >

From: JP Jamous
Date: Thu, Jan 12 2017 7:09AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

Thank you Bryan. That makes more sense to me now.

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Bryan Garaventa
Sent: Thursday, January 12, 2017 12:06 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] JAWS and disabled combobox options

No problem, happy to help. :) One note for others, the bookmarklet was simply a personal utility I created to work around some accessibility issues I was encountering, but this should not ever be part of any development strategy for making something like this accessible.

To answer a prior question from JP Jamous, the scenario described has only one select element.

E.G Example syntax:

<select title="Choose a County" >
<option >Arizona</option>
<optgroup>
<option> County Name One </option>
<option> County Name Two </option>
</optgroup>
<option >California</option>
<optgroup>
<option> County Name One </option>
<option> County Name Two </option>
</optgroup>
</select>

You can quickly jump to California by typing "cal".

However if you try the following instead, this is impossible.


<select title="Choose a County" >
<option disabled >Arizona</option>
<optgroup>
<option> County Name One </option>
<option> County Name Two </option>
</optgroup>
<option disabled >California</option>
<optgroup>
<option> County Name One </option>
<option> County Name Two </option>
</optgroup>
</select>

This is why this practice should never be done.

Instead, client side scripting should be used to check the value of such options and prevent submission if the intended value is not selected.



Bryan Garaventa
Accessibility Fellow
SSB BART Group, Inc.
= EMAIL ADDRESS REMOVED =
415.624.2709 (o)
www.SSBBartGroup.com

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Paul Collins
Sent: Wednesday, January 11, 2017 8:08 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] JAWS and disabled combobox options

Hi everyone, thanks for your replies, I really appreciate your input.

Bryan, your bookmarklet is a great idea, I've saved it. The decision to disable options in a select box was not mine, it was handed to me - I'm working on a large scale enterprise app and as you can imagine, in these situations accessibility is often a series of compromises between UX, Design, Product Owners, Developers, etc to work out the best solution.

However, based on everyone's feedback, I've managed to come up with a better solution that seems to satisfy all the stakeholders involved :)

The drop down contained a list of accounts. Some were disabled occasionally, but we wanted to communicate which ones. I've now removed all disabled accounts from the drop down and listed them in a descriptive warning message, associated with the selectbox using aria-describedby.

Hope that makes sense. Thanks for your input everyone, it made me rethink the design and come up with a better solution.

All the best,
Paul


On 12 January 2017 at 05:55, JP Jamous < = EMAIL ADDRESS REMOVED = > wrote:

> Bryan,
> Do you have a page that I can check out? I am not following you,
> because from your description it sounded like both the States and
> Counties are loading in the same dropdown box, which cannot be correct.
>
> I know I am losing you somewhere. I do understand though that when one
> country is selected the state item should become disabled.
>
> Are the counties in a different dropdown or are they check boxes or
> radio buttons? Just trying to map out the layout in my head.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Bryan Garaventa
> Sent: Wednesday, January 11, 2017 12:33 PM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> Hi,
> This does come up in large more complex select fields quite often,
> though not so much for the standard day to day usage.
>
> Here is an example that demonstrates the scenario.
>
> There is a select element that includes options for all of the
> counties in the United States, and at the start of each county list is
> an option element that includes the State name that this section
> belongs to. E.G California.
>
> Since it's only valid to submit the field when a county is selected,
> but not when a State name is selected, some developers will disable
> the State name option element.
>
> The result of this however is that it then makes it impossible to
> quickly jump to the beginning of these sections by pressing a letter
> such as "c" to jump to california, and it makes it impossible to even
> read the State name when arrowing up and down, making it impossible to
> determine which section you are even in.
>
> It was this type of scenario that drove me to create the bookmarklet
> because dealing with this type of situation daily was driving me nuts.
>
>
>
>
> Bryan Garaventa
> Accessibility Fellow
> SSB BART Group, Inc.
> = EMAIL ADDRESS REMOVED =
> 415.624.2709 (o)
> www.SSBBartGroup.com
>
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of JP Jamous
> Sent: Wednesday, January 11, 2017 8:52 AM
> To: 'WebAIM Discussion List' < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> I am following this post and thinking of it as I don't have the time
> to test it. I want to fall back to Windows Development for a second to
> address it.
>
> When a list view or combo box loaded data from a DB, programmers and I
> always repopulated the items from the DB or an array in the RAM. The
> question becomes, why do you want to disable a dropdown item if there
> is no way to interact with it? Simply remove it by using style="display: none;"
> Problem solved.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Jonathan Avila
> Sent: Wednesday, January 11, 2017 10:24 AM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> > Just wondering if anyone has tackled this and how they managed to
> communicate to the screen reader user that the option is there and disabled?
>
> The support of aria-disabled doesn't seem to work correctly in my
> tests with IE and JAWS. But it does seem to be communicated in
> Firefox. You would then need to communicate somehow visually that the
> option was disabled as well -- perhaps with some styling?
>
> Jonathan
>
> Jonathan Avila
> Chief Accessibility Officer
> SSB BART Group
> = EMAIL ADDRESS REMOVED =
> 703.637.8957 (Office)
> Vis Visit us online: Website | Twitter | Facebook | LinkedIn | Blog
> See you at CSUN in March!
>
> The information contained in this transmission may be attorney
> privileged and/or confidential information intended for the use of the
> individual or entity named above. If the reader of this message is not
> the intended recipient, you are hereby notified that any use,
> dissemination, distribution or copying of this communication is strictly prohibited.
>
>
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Paul Collins
> Sent: Wednesday, January 11, 2017 1:04 AM
> To: WebAIM Discussion List
> Subject: [WebAIM] JAWS and disabled combobox options
>
> Hi friends.
>
> I'm currently working on a project where individual options in a
> select box are disabled, using the *disabled* attribute:
>
> *<select>*
> * <option>option 1</option>*
> * <option disabled>option 2</option>*
> *</select>*
>
> When using the keyboard arrow keys, it skips over each disabled option.
> This also means *JAWS* doesn't read out the disabled option either.
>
> Just wondering if anyone has tackled this and how they managed to
> communicate to the screen reader user that the option is there and disabled?
>
> Thanks for any help.
> Paul
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >
> > > archives at http://webaim.org/discussion/archives
> >

From: _mallory
Date: Wed, Jan 18 2017 5:36AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

Looks like the developer should have used optgroup instead of
disabled options. The States are groups, but not values
themselves.

cheers,
_mallory

On Thu, Jan 12, 2017 at 08:09:10AM -0600, JP Jamous wrote:
> Thank you Bryan. That makes more sense to me now.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Bryan Garaventa
> Sent: Thursday, January 12, 2017 12:06 AM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> No problem, happy to help. :) One note for others, the bookmarklet was simply a personal utility I created to work around some accessibility issues I was encountering, but this should not ever be part of any development strategy for making something like this accessible.
>
> To answer a prior question from JP Jamous, the scenario described has only one select element.
>
> E.G Example syntax:
>
> <select title="Choose a County" >
> <option >Arizona</option>
> <optgroup>
> <option> County Name One </option>
> <option> County Name Two </option>
> </optgroup>
> <option >California</option>
> <optgroup>
> <option> County Name One </option>
> <option> County Name Two </option>
> </optgroup>
> </select>
>
> You can quickly jump to California by typing "cal".
>
> However if you try the following instead, this is impossible.
>
>
> <select title="Choose a County" >
> <option disabled >Arizona</option>
> <optgroup>
> <option> County Name One </option>
> <option> County Name Two </option>
> </optgroup>
> <option disabled >California</option>
> <optgroup>
> <option> County Name One </option>
> <option> County Name Two </option>
> </optgroup>
> </select>
>
> This is why this practice should never be done.
>
> Instead, client side scripting should be used to check the value of such options and prevent submission if the intended value is not selected.
>
>
>
> Bryan Garaventa
> Accessibility Fellow
> SSB BART Group, Inc.
> = EMAIL ADDRESS REMOVED =
> 415.624.2709 (o)
> www.SSBBartGroup.com

From: Jonathan Avila
Date: Wed, Jan 18 2017 9:40AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

> Looks like the developer should have used optgroup instead of disabled options. The States are groups, but not values themselves.

Except use of optgroup doesn't allow for keyboard navigation using first letter of the item in the optgroup. And optgroup isn't well supported by assistive technology in my experience.

Jonathan

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of _mallory
Sent: Wednesday, January 18, 2017 7:37 AM
To: WebAIM Discussion List
Subject: Re: [WebAIM] JAWS and disabled combobox options

Looks like the developer should have used optgroup instead of disabled options. The States are groups, but not values themselves.

cheers,
_mallory

On Thu, Jan 12, 2017 at 08:09:10AM -0600, JP Jamous wrote:
> Thank you Bryan. That makes more sense to me now.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Bryan Garaventa
> Sent: Thursday, January 12, 2017 12:06 AM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> No problem, happy to help. :) One note for others, the bookmarklet was simply a personal utility I created to work around some accessibility issues I was encountering, but this should not ever be part of any development strategy for making something like this accessible.
>
> To answer a prior question from JP Jamous, the scenario described has only one select element.
>
> E.G Example syntax:
>
> <select title="Choose a County" >
> <option >Arizona</option>
> <optgroup>
> <option> County Name One </option>
> <option> County Name Two </option>
> </optgroup>
> <option >California</option>
> <optgroup>
> <option> County Name One </option>
> <option> County Name Two </option>
> </optgroup>
> </select>
>
> You can quickly jump to California by typing "cal".
>
> However if you try the following instead, this is impossible.
>
>
> <select title="Choose a County" >
> <option disabled >Arizona</option>
> <optgroup>
> <option> County Name One </option>
> <option> County Name Two </option>
> </optgroup>
> <option disabled >California</option>
> <optgroup>
> <option> County Name One </option>
> <option> County Name Two </option>
> </optgroup>
> </select>
>
> This is why this practice should never be done.
>
> Instead, client side scripting should be used to check the value of such options and prevent submission if the intended value is not selected.
>
>
>
> Bryan Garaventa
> Accessibility Fellow
> SSB BART Group, Inc.
> = EMAIL ADDRESS REMOVED =
> 415.624.2709 (o)
> www.SSBBartGroup.com

From: Jim Allan
Date: Wed, Jan 18 2017 11:33AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

in my testing in windows (IE, FF, and chrome) first letter navigation
worked in a select with optgroup.

On Wed, Jan 18, 2017 at 10:40 AM, Jonathan Avila < = EMAIL ADDRESS REMOVED =
> wrote:

> > Looks like the developer should have used optgroup instead of disabled
> options. The States are groups, but not values themselves.
>
> Except use of optgroup doesn't allow for keyboard navigation using first
> letter of the item in the optgroup. And optgroup isn't well supported by
> assistive technology in my experience.
>
> Jonathan
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of _mallory
> Sent: Wednesday, January 18, 2017 7:37 AM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> Looks like the developer should have used optgroup instead of disabled
> options. The States are groups, but not values themselves.
>
> cheers,
> _mallory
>
> On Thu, Jan 12, 2017 at 08:09:10AM -0600, JP Jamous wrote:
> > Thank you Bryan. That makes more sense to me now.
> >
> > -----Original Message-----
> > From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> > Behalf Of Bryan Garaventa
> > Sent: Thursday, January 12, 2017 12:06 AM
> > To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> > Subject: Re: [WebAIM] JAWS and disabled combobox options
> >
> > No problem, happy to help. :) One note for others, the bookmarklet was
> simply a personal utility I created to work around some accessibility
> issues I was encountering, but this should not ever be part of any
> development strategy for making something like this accessible.
> >
> > To answer a prior question from JP Jamous, the scenario described has
> only one select element.
> >
> > E.G Example syntax:
> >
> > <select title="Choose a County" >
> > <option >Arizona</option>
> > <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > <option >California</option>
> > <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > </select>
> >
> > You can quickly jump to California by typing "cal".
> >
> > However if you try the following instead, this is impossible.
> >
> >
> > <select title="Choose a County" >
> > <option disabled >Arizona</option>
> > <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > <option disabled >California</option>
> > <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > </select>
> >
> > This is why this practice should never be done.
> >
> > Instead, client side scripting should be used to check the value of such
> options and prevent submission if the intended value is not selected.
> >
> >
> >
> > Bryan Garaventa
> > Accessibility Fellow
> > SSB BART Group, Inc.
> > = EMAIL ADDRESS REMOVED =
> > 415.624.2709 (o)
> > www.SSBBartGroup.com
> > > at http://webaim.org/discussion/archives
> > > > > >



--
Jim Allan, Accessibility Coordinator
Texas School for the Blind and Visually Impaired
1100 W. 45th St., Austin, Texas 78756
voice 512.206.9315 fax: 512.206.9264 http://www.tsbvi.edu/
"We shape our tools and thereafter our tools shape us." McLuhan, 1964

From: Jonathan Avila
Date: Wed, Jan 18 2017 11:43AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

> in my testing in windows (IE, FF, and chrome) first letter navigation worked in a select with optgroup.

So for example, if the optgroup name is "Mobile" pressing "m" does not take me to the first item under mobile.

Jonathan

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Jim Allan
Sent: Wednesday, January 18, 2017 1:33 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] JAWS and disabled combobox options

in my testing in windows (IE, FF, and chrome) first letter navigation worked in a select with optgroup.

On Wed, Jan 18, 2017 at 10:40 AM, Jonathan Avila < = EMAIL ADDRESS REMOVED =
> wrote:

> > Looks like the developer should have used optgroup instead of
> > disabled
> options. The States are groups, but not values themselves.
>
> Except use of optgroup doesn't allow for keyboard navigation using
> first letter of the item in the optgroup. And optgroup isn't well
> supported by assistive technology in my experience.
>
> Jonathan
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of _mallory
> Sent: Wednesday, January 18, 2017 7:37 AM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> Looks like the developer should have used optgroup instead of disabled
> options. The States are groups, but not values themselves.
>
> cheers,
> _mallory
>
> On Thu, Jan 12, 2017 at 08:09:10AM -0600, JP Jamous wrote:
> > Thank you Bryan. That makes more sense to me now.
> >
> > -----Original Message-----
> > From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> > Behalf Of Bryan Garaventa
> > Sent: Thursday, January 12, 2017 12:06 AM
> > To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> > Subject: Re: [WebAIM] JAWS and disabled combobox options
> >
> > No problem, happy to help. :) One note for others, the bookmarklet
> > was
> simply a personal utility I created to work around some accessibility
> issues I was encountering, but this should not ever be part of any
> development strategy for making something like this accessible.
> >
> > To answer a prior question from JP Jamous, the scenario described
> > has
> only one select element.
> >
> > E.G Example syntax:
> >
> > <select title="Choose a County" >
> > <option >Arizona</option>
> > <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > <option >California</option>
> > <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > </select>
> >
> > You can quickly jump to California by typing "cal".
> >
> > However if you try the following instead, this is impossible.
> >
> >
> > <select title="Choose a County" >
> > <option disabled >Arizona</option>
> > <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > <option disabled >California</option> <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > </select>
> >
> > This is why this practice should never be done.
> >
> > Instead, client side scripting should be used to check the value of
> > such
> options and prevent submission if the intended value is not selected.
> >
> >
> >
> > Bryan Garaventa
> > Accessibility Fellow
> > SSB BART Group, Inc.
> > = EMAIL ADDRESS REMOVED =
> > 415.624.2709 (o)
> > www.SSBBartGroup.com
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >



--
Jim Allan, Accessibility Coordinator
Texas School for the Blind and Visually Impaired
1100 W. 45th St., Austin, Texas 78756
voice 512.206.9315 fax: 512.206.9264 http://www.tsbvi.edu/
"We shape our tools and thereafter our tools shape us." McLuhan, 1964

From: Jim Allan
Date: Wed, Jan 18 2017 1:33PM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

ah, thanks for the clarification. first letter navigation only works with
the <option>s not the <optgroup>. This is a browser "feature". AT will have
to go beyond standard browser behavior to make <optgroup> navigable.
JAWS and NVDA with Firefox did preface the <optgroup> value when speaking
the <option>. NVDA said "color grouping, blue item 2 of 3"

On Wed, Jan 18, 2017 at 12:43 PM, Jonathan Avila < = EMAIL ADDRESS REMOVED =
> wrote:

> > in my testing in windows (IE, FF, and chrome) first letter navigation
> worked in a select with optgroup.
>
> So for example, if the optgroup name is "Mobile" pressing "m" does not
> take me to the first item under mobile.
>
> Jonathan
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of Jim Allan
> Sent: Wednesday, January 18, 2017 1:33 PM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> in my testing in windows (IE, FF, and chrome) first letter navigation
> worked in a select with optgroup.
>
> On Wed, Jan 18, 2017 at 10:40 AM, Jonathan Avila <
> = EMAIL ADDRESS REMOVED =
> > wrote:
>
> > > Looks like the developer should have used optgroup instead of
> > > disabled
> > options. The States are groups, but not values themselves.
> >
> > Except use of optgroup doesn't allow for keyboard navigation using
> > first letter of the item in the optgroup. And optgroup isn't well
> > supported by assistive technology in my experience.
> >
> > Jonathan
> >
> > -----Original Message-----
> > From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> > Behalf Of _mallory
> > Sent: Wednesday, January 18, 2017 7:37 AM
> > To: WebAIM Discussion List
> > Subject: Re: [WebAIM] JAWS and disabled combobox options
> >
> > Looks like the developer should have used optgroup instead of disabled
> > options. The States are groups, but not values themselves.
> >
> > cheers,
> > _mallory
> >
> > On Thu, Jan 12, 2017 at 08:09:10AM -0600, JP Jamous wrote:
> > > Thank you Bryan. That makes more sense to me now.
> > >
> > > -----Original Message-----
> > > From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> > > Behalf Of Bryan Garaventa
> > > Sent: Thursday, January 12, 2017 12:06 AM
> > > To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> > > Subject: Re: [WebAIM] JAWS and disabled combobox options
> > >
> > > No problem, happy to help. :) One note for others, the bookmarklet
> > > was
> > simply a personal utility I created to work around some accessibility
> > issues I was encountering, but this should not ever be part of any
> > development strategy for making something like this accessible.
> > >
> > > To answer a prior question from JP Jamous, the scenario described
> > > has
> > only one select element.
> > >
> > > E.G Example syntax:
> > >
> > > <select title="Choose a County" >
> > > <option >Arizona</option>
> > > <optgroup>
> > > <option> County Name One </option>
> > > <option> County Name Two </option>
> > > </optgroup>
> > > <option >California</option>
> > > <optgroup>
> > > <option> County Name One </option>
> > > <option> County Name Two </option>
> > > </optgroup>
> > > </select>
> > >
> > > You can quickly jump to California by typing "cal".
> > >
> > > However if you try the following instead, this is impossible.
> > >
> > >
> > > <select title="Choose a County" >
> > > <option disabled >Arizona</option>
> > > <optgroup>
> > > <option> County Name One </option>
> > > <option> County Name Two </option>
> > > </optgroup>
> > > <option disabled >California</option> <optgroup>
> > > <option> County Name One </option>
> > > <option> County Name Two </option>
> > > </optgroup>
> > > </select>
> > >
> > > This is why this practice should never be done.
> > >
> > > Instead, client side scripting should be used to check the value of
> > > such
> > options and prevent submission if the intended value is not selected.
> > >
> > >
> > >
> > > Bryan Garaventa
> > > Accessibility Fellow
> > > SSB BART Group, Inc.
> > > = EMAIL ADDRESS REMOVED =
> > > 415.624.2709 (o)
> > > www.SSBBartGroup.com
> > > > > > archives at http://webaim.org/discussion/archives
> > > > > > > > archives at http://webaim.org/discussion/archives
> > > >
>
>
>
> --
> Jim Allan, Accessibility Coordinator
> Texas School for the Blind and Visually Impaired
> 1100 W. 45th St., Austin, Texas 78756
> voice 512.206.9315 fax: 512.206.9264 http://www.tsbvi.edu/
> "We shape our tools and thereafter our tools shape us." McLuhan, 1964
> > > at http://webaim.org/discussion/archives
> > > > > >



--
Jim Allan, Accessibility Coordinator
Texas School for the Blind and Visually Impaired
1100 W. 45th St., Austin, Texas 78756
voice 512.206.9315 fax: 512.206.9264 http://www.tsbvi.edu/
"We shape our tools and thereafter our tools shape us." McLuhan, 1964

From: Joan Preston
Date: Wed, Jan 18 2017 2:57PM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

From a developer/UI perspective and with a database backend: the user would select the state and then the county select would be populated. I think a list with all the counties in the US would be rather long and if you lived in a state that in near the end of the alphabet, that would take some time to get through the list whether you are sighted or not.

Basically, designing a good UI would be the key to not having a select with options disabled.

Thanks,

Joan Preston
Web Accessibility Coordinator
ITS - California State University, Long Beach


-----Original Message-----
From: Jonathan Avila [mailto: = EMAIL ADDRESS REMOVED = ]
Sent: Wednesday, January 18, 2017 10:43 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] JAWS and disabled combobox options

> in my testing in windows (IE, FF, and chrome) first letter navigation worked in a select with optgroup.

So for example, if the optgroup name is "Mobile" pressing "m" does not take me to the first item under mobile.

Jonathan

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Jim Allan
Sent: Wednesday, January 18, 2017 1:33 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] JAWS and disabled combobox options

in my testing in windows (IE, FF, and chrome) first letter navigation worked in a select with optgroup.

On Wed, Jan 18, 2017 at 10:40 AM, Jonathan Avila < = EMAIL ADDRESS REMOVED =
> wrote:

> > Looks like the developer should have used optgroup instead of
> > disabled
> options. The States are groups, but not values themselves.
>
> Except use of optgroup doesn't allow for keyboard navigation using
> first letter of the item in the optgroup. And optgroup isn't well
> supported by assistive technology in my experience.
>
> Jonathan
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of _mallory
> Sent: Wednesday, January 18, 2017 7:37 AM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> Looks like the developer should have used optgroup instead of disabled
> options. The States are groups, but not values themselves.
>
> cheers,
> _mallory
>
> On Thu, Jan 12, 2017 at 08:09:10AM -0600, JP Jamous wrote:
> > Thank you Bryan. That makes more sense to me now.
> >
> > -----Original Message-----
> > From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> > Behalf Of Bryan Garaventa
> > Sent: Thursday, January 12, 2017 12:06 AM
> > To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> > Subject: Re: [WebAIM] JAWS and disabled combobox options
> >
> > No problem, happy to help. :) One note for others, the bookmarklet
> > was
> simply a personal utility I created to work around some accessibility
> issues I was encountering, but this should not ever be part of any
> development strategy for making something like this accessible.
> >
> > To answer a prior question from JP Jamous, the scenario described
> > has
> only one select element.
> >
> > E.G Example syntax:
> >
> > <select title="Choose a County" >
> > <option >Arizona</option>
> > <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > <option >California</option>
> > <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > </select>
> >
> > You can quickly jump to California by typing "cal".
> >
> > However if you try the following instead, this is impossible.
> >
> >
> > <select title="Choose a County" >
> > <option disabled >Arizona</option>
> > <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > <option disabled >California</option> <optgroup>
> > <option> County Name One </option>
> > <option> County Name Two </option>
> > </optgroup>
> > </select>
> >
> > This is why this practice should never be done.
> >
> > Instead, client side scripting should be used to check the value of
> > such
> options and prevent submission if the intended value is not selected.
> >
> >
> >
> > Bryan Garaventa
> > Accessibility Fellow
> > SSB BART Group, Inc.
> > = EMAIL ADDRESS REMOVED =
> > 415.624.2709 (o)
> > www.SSBBartGroup.com
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >



--
Jim Allan, Accessibility Coordinator
Texas School for the Blind and Visually Impaired
1100 W. 45th St., Austin, Texas 78756
voice 512.206.9315 fax: 512.206.9264 http://www.tsbvi.edu/
"We shape our tools and thereafter our tools shape us." McLuhan, 1964

From: Detlev Fischer
Date: Thu, Jan 19 2017 3:31AM
Subject: Re: JAWS and disabled combobox options
Previous message | Next message

Hi Jonathan,

So you think the general advice for accessible content would be to avoid optgroup altogether (rather than pushing UA or AT makers to better support it)?
I just had a quick look at the problem myself with Firefox and NVDA, going to an the search page of an app that I developed where we use select with optgroup:
https://anpassungsfinder.de/anpass/anpass_search/
It's the second select labeled "Hilfsmittel"

When I open the select with ALT + ARROW DOWN (or space bar), I am able to type keys to jump straight to options despite the presence of optgroup. So it looks there are implementations where selecting options by letter DO work. (Haven't cecked otzhe browasers and screenreaders yet. BTW in the app, ther ARE issues with selecting options, but I believe they are down to the automatic updating of search results and in turn reduced options dispayed in the select - we need to look at that).

Best, Detlev

--
Detlev Fischer
testkreis c/o feld.wald.wiese
Thedestr. 2, 22767 Hamburg

Mobil +49 (0)157 57 57 57 45
Fax +49 (0)40 439 10 68-5

http://www.testkreis.de
Beratung, Tests und Schulungen für barrierefreie Websites

Jonathan Avila schrieb am 18.01.2017 17:40:

>> Looks like the developer should have used optgroup instead of disabled
>> options. The States are groups, but not values themselves.
>
> Except use of optgroup doesn't allow for keyboard navigation using first letter
> of the item in the optgroup. And optgroup isn't well supported by assistive
> technology in my experience.
>
> Jonathan
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of
> _mallory
> Sent: Wednesday, January 18, 2017 7:37 AM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> Looks like the developer should have used optgroup instead of disabled options.
> The States are groups, but not values themselves.
>
> cheers,
> _mallory
>
> On Thu, Jan 12, 2017 at 08:09:10AM -0600, JP Jamous wrote:
>> Thank you Bryan. That makes more sense to me now.
>>
>> -----Original Message-----
>> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
>> Behalf Of Bryan Garaventa
>> Sent: Thursday, January 12, 2017 12:06 AM
>> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>> Subject: Re: [WebAIM] JAWS and disabled combobox options
>>
>> No problem, happy to help. :) One note for others, the bookmarklet was simply
>> a personal utility I created to work around some accessibility issues I was
>> encountering, but this should not ever be part of any development strategy for
>> making something like this accessible.
>>
>> To answer a prior question from JP Jamous, the scenario described has only one
>> select element.
>>
>> E.G Example syntax:
>>
>> <select title="Choose a County" >
>> <option >Arizona</option>
>> <optgroup>
>> <option> County Name One </option>
>> <option> County Name Two </option>
>> </optgroup>
>> <option >California</option>
>> <optgroup>
>> <option> County Name One </option>
>> <option> County Name Two </option>
>> </optgroup>
>> </select>
>>
>> You can quickly jump to California by typing "cal".
>>
>> However if you try the following instead, this is impossible.
>>
>>
>> <select title="Choose a County" >
>> <option disabled >Arizona</option>
>> <optgroup>
>> <option> County Name One </option>
>> <option> County Name Two </option>
>> </optgroup>
>> <option disabled >California</option>
>> <optgroup>
>> <option> County Name One </option>
>> <option> County Name Two </option>
>> </optgroup>
>> </select>
>>
>> This is why this practice should never be done.
>>
>> Instead, client side scripting should be used to check the value of such
>> options and prevent submission if the intended value is not selected.
>>
>>
>>
>> Bryan Garaventa
>> Accessibility Fellow
>> SSB BART Group, Inc.
>> = EMAIL ADDRESS REMOVED =
>> 415.624.2709 (o)
>> www.SSBBartGroup.com
> > > http://webaim.org/discussion/archives
> > > > > >

From: Jonathan Avila
Date: Fri, Jan 20 2017 8:16PM
Subject: Re: JAWS and disabled combobox options
Previous message | No next message

> When I open the select with ALT + ARROW DOWN (or space bar), I am able to type keys to jump straight to options despite the presence of optgroup. So it

Detlev, the issue is that you can't press the letter of the optgroup name to jump to that group. So there is no way to quickly navigate between groups.

Separately, in my experience with IE the optgroup names are not announced with screen readers. I believe the optgroup names are announced in Firefox.

Jonathan



-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Detlev Fischer
Sent: Thursday, January 19, 2017 5:31 AM
To: = EMAIL ADDRESS REMOVED =
Subject: Re: [WebAIM] JAWS and disabled combobox options

Hi Jonathan,

So you think the general advice for accessible content would be to avoid optgroup altogether (rather than pushing UA or AT makers to better support it)?
I just had a quick look at the problem myself with Firefox and NVDA, going to an the search page of an app that I developed where we use select with optgroup:
https://anpassungsfinder.de/anpass/anpass_search/
It's the second select labeled "Hilfsmittel"

When I open the select with ALT + ARROW DOWN (or space bar), I am able to type keys to jump straight to options despite the presence of optgroup. So it looks there are implementations where selecting options by letter DO work. (Haven't cecked otzhe browasers and screenreaders yet. BTW in the app, ther ARE issues with selecting options, but I believe they are down to the automatic updating of search results and in turn reduced options dispayed in the select - we need to look at that).

Best, Detlev

--
Detlev Fischer
testkreis c/o feld.wald.wiese
Thedestr. 2, 22767 Hamburg

Mobil +49 (0)157 57 57 57 45
Fax +49 (0)40 439 10 68-5

http://www.testkreis.de
Beratung, Tests und Schulungen für barrierefreie Websites

Jonathan Avila schrieb am 18.01.2017 17:40:

>> Looks like the developer should have used optgroup instead of
>> disabled options. The States are groups, but not values themselves.
>
> Except use of optgroup doesn't allow for keyboard navigation using
> first letter of the item in the optgroup. And optgroup isn't well
> supported by assistive technology in my experience.
>
> Jonathan
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
> Behalf Of _mallory
> Sent: Wednesday, January 18, 2017 7:37 AM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] JAWS and disabled combobox options
>
> Looks like the developer should have used optgroup instead of disabled options.
> The States are groups, but not values themselves.
>
> cheers,
> _mallory
>
> On Thu, Jan 12, 2017 at 08:09:10AM -0600, JP Jamous wrote:
>> Thank you Bryan. That makes more sense to me now.
>>
>> -----Original Message-----
>> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On
>> Behalf Of Bryan Garaventa
>> Sent: Thursday, January 12, 2017 12:06 AM
>> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
>> Subject: Re: [WebAIM] JAWS and disabled combobox options
>>
>> No problem, happy to help. :) One note for others, the bookmarklet
>> was simply a personal utility I created to work around some
>> accessibility issues I was encountering, but this should not ever be
>> part of any development strategy for making something like this accessible.
>>
>> To answer a prior question from JP Jamous, the scenario described has
>> only one select element.
>>
>> E.G Example syntax:
>>
>> <select title="Choose a County" >
>> <option >Arizona</option>
>> <optgroup>
>> <option> County Name One </option>
>> <option> County Name Two </option>
>> </optgroup>
>> <option >California</option>
>> <optgroup>
>> <option> County Name One </option>
>> <option> County Name Two </option>
>> </optgroup>
>> </select>
>>
>> You can quickly jump to California by typing "cal".
>>
>> However if you try the following instead, this is impossible.
>>
>>
>> <select title="Choose a County" >
>> <option disabled >Arizona</option>
>> <optgroup>
>> <option> County Name One </option>
>> <option> County Name Two </option>
>> </optgroup>
>> <option disabled >California</option> <optgroup>
>> <option> County Name One </option>
>> <option> County Name Two </option>
>> </optgroup>
>> </select>
>>
>> This is why this practice should never be done.
>>
>> Instead, client side scripting should be used to check the value of
>> such options and prevent submission if the intended value is not selected.
>>
>>
>>
>> Bryan Garaventa
>> Accessibility Fellow
>> SSB BART Group, Inc.
>> = EMAIL ADDRESS REMOVED =
>> 415.624.2709 (o)
>> www.SSBBartGroup.com
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >