WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Accessible Combo Boxes

for

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

From: Kakarla Meharoon
Date: Thu, Mar 01 2018 3:40AM
Subject: Accessible Combo Boxes
No previous message | Next message →

*Hi All,*
*Combo boxes are not working with JAWS in IE Browser. Any inputs?*

From: Josh Schroder
Date: Thu, Mar 01 2018 8:42AM
Subject: Re: Accessible Combo Boxes
← Previous message | Next message →

Hi Kakarla,

I believe that combo-boxes have historically been problematic for accessibility.

You may be able to implement some workarounds to improve functionality, but the advice over the years has typically been to use checkboxes instead.

Select2 looks like a promising alternative, but I've not used it myself.
https://select2.org/

Josh Schroder
Web Administrator III
Office of Strategic Communications
Texas Department of Licensing and Regulation
(512) 936-8937

From: Brandon Keith Biggs
Date: Thu, Mar 01 2018 10:38AM
Subject: Re: Accessible Combo Boxes
← Previous message | Next message →

Hello,
AccDC has several that work:
http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Editable%20and%20Readonly)/demo.htm

http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Editable%20with%20Substring%20Match)/demo.htm

http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Multiselect%20Editable%20with%20Substring%20Match)/demo.htm

http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Simulated,%20Readonly%20Multiselect)/demo.htm

There are several more, but you can check them out for yourself. They all
work for me.
Thanks,


Brandon Keith Biggs <http://brandonkeithbiggs.com/>;

On Thu, Mar 1, 2018 at 7:42 AM, Josh Schroder < = EMAIL ADDRESS REMOVED = >
wrote:

> Hi Kakarla,
>
> I believe that combo-boxes have historically been problematic for
> accessibility.
>
> You may be able to implement some workarounds to improve functionality,
> but the advice over the years has typically been to use checkboxes instead.
>
> Select2 looks like a promising alternative, but I've not used it myself.
> https://select2.org/
>
> Josh Schroder
> Web Administrator III
> Office of Strategic Communications
> Texas Department of Licensing and Regulation
> (512) 936-8937
>
>

From: Caitlin Geier
Date: Thu, Mar 01 2018 12:09PM
Subject: Re: Accessible Combo Boxes
← Previous message | Next message →

My coworker built an accessible combobox. It supports both single select
and multiselect modes. We had the same problem with the native comboboxes,
and needed to roll our own for a product. My coworker open-sourced the
prototype he created for the project.

Demo: https://schne324.github.io/combobo/demo/
Github: https://github.com/schne324/combobo


On Thu, Mar 1, 2018 at 12:38 PM Brandon Keith Biggs <
= EMAIL ADDRESS REMOVED = > wrote:

> Hello,
> AccDC has several that work:
>
> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Editable%20and%20Readonly)/demo.htm
>
>
> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Editable%20with%20Substring%20Match)/demo.htm
>
>
> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Multiselect%20Editable%20with%20Substring%20Match)/demo.htm
>
>
> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Simulated,%20Readonly%20Multiselect)/demo.htm
>
> There are several more, but you can check them out for yourself. They all
> work for me.
> Thanks,
>
>
> Brandon Keith Biggs <http://brandonkeithbiggs.com/>;
>
> On Thu, Mar 1, 2018 at 7:42 AM, Josh Schroder <
> = EMAIL ADDRESS REMOVED = >
> wrote:
>
> > Hi Kakarla,
> >
> > I believe that combo-boxes have historically been problematic for
> > accessibility.
> >
> > You may be able to implement some workarounds to improve functionality,
> > but the advice over the years has typically been to use checkboxes
> instead.
> >
> > Select2 looks like a promising alternative, but I've not used it myself.
> > https://select2.org/
> >
> > Josh Schroder
> > Web Administrator III
> > Office of Strategic Communications
> > Texas Department of Licensing and Regulation
> > (512) 936-8937
> >
> >

From: Henry, Michael (IntelliDyne)
Date: Thu, Mar 01 2018 12:56PM
Subject: Re: Accessible Combo Boxes
← Previous message | Next message →

Has this been tested? It looks pretty promising.


---
Mike S. Henry
Creative Services Lead
IntelliDyne Contract Employee
Supporting Enterprise Infrastructure (formerly Military Health System Cyberinfrastructure Services - MCiS)
Desk: (703) 882-3962

From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > on behalf of Caitlin Geier < = EMAIL ADDRESS REMOVED = >
Sent: Thursday, March 1, 2018 2:09:15 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Accessible Combo Boxes

My coworker built an accessible combobox. It supports both single select
and multiselect modes. We had the same problem with the native comboboxes,
and needed to roll our own for a product. My coworker open-sourced the
prototype he created for the project.

Demo: https://schne324.github.io/combobo/demo/
Github: https://github.com/schne324/combobo


On Thu, Mar 1, 2018 at 12:38 PM Brandon Keith Biggs <
= EMAIL ADDRESS REMOVED = > wrote:

> Hello,
> AccDC has several that work:
>
> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Editable%20and%20Readonly)/demo.htm
>
>
> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Editable%20with%20Substring%20Match)/demo.htm
>
>
> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Multiselect%20Editable%20with%20Substring%20Match)/demo.htm
>
>
> http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Simulated,%20Readonly%20Multiselect)/demo.htm
>
> There are several more, but you can check them out for yourself. They all
> work for me.
> Thanks,
>
>
> Brandon Keith Biggs <http://brandonkeithbiggs.com/>;
>
> On Thu, Mar 1, 2018 at 7:42 AM, Josh Schroder <
> = EMAIL ADDRESS REMOVED = >
> wrote:
>
> > Hi Kakarla,
> >
> > I believe that combo-boxes have historically been problematic for
> > accessibility.
> >
> > You may be able to implement some workarounds to improve functionality,
> > but the advice over the years has typically been to use checkboxes
> instead.
> >
> > Select2 looks like a promising alternative, but I've not used it myself.
> > https://select2.org/
> >
> > Josh Schroder
> > Web Administrator III
> > Office of Strategic Communications
> > Texas Department of Licensing and Regulation
> > (512) 936-8937
> >
> >

From: Tim Harshbarger
Date: Thu, Mar 01 2018 1:08PM
Subject: Re: Accessible Combo Boxes
← Previous message | Next message →

Typically JAWS does not have problems with a combo box if it was created using the HTML select element. In fact, I just had to use a couple such combo boxes with JAWS in IE a bit ago and didn't seem to have any problems doing so. If you need to select multiple items in such a combo box, it can be problematic because you need to remember a rather obscure keyboard shortcut to do that--so one of the examples provided previously might work better in that case.

If you are using an HTML select element to create the combo box and having problems using it, you might want to check that the HTML is valid and also figure out if there is any javascript involved that might be altering the behavior of the combo box.

If you are trying to create a combo box from scratch, you should definitely look at the ones that were previously suggested. Using one of those will save you a lot of work and testing and even if they don't do exactly what you need, it will likely make your life easier if you can build off of them.

Thanks,
Tim

From: Bryan Garaventa
Date: Thu, Mar 01 2018 2:29PM
Subject: Re: Accessible Combo Boxes
← Previous message | No next message

Hi,
The important thing to keep in mind when constructing simulated combobox widgets is to have a full understanding of the differences between the ARIA 1.0 and 1.1 design patterns, and what is safe to use and when. These are fully described here
https://www.levelaccess.com/differences-aria-1-0-1-1-changes-rolecombobox/

This is why the AccDC Combobox widgets work accessibly, because they are constructed with strict adherance to these rules.

All the best,
Bryan


Bryan Garaventa
Accessibility Fellow
Level Access, Inc.
= EMAIL ADDRESS REMOVED =
415.624.2709 (o)
www.LevelAccess.com