Skip to content

Custom select menu accessibility #4039

jaspermdegroot opened this Issue Apr 14, 2012 · 4 comments

2 participants

jQuery Foundation member

Custom select menus with multiple selects can't be accessed by keyboard. They can be opened but you can't select anything or close the menu.

Also, once the tab key is used while a custom menu is displayed it is not possible to get focus/access to the option list anymore.


I just tested this page on Chrome/Mac and I can use the keyboard:

What browser? Guessing it's Firefox's buggy focus stuff.

jQuery Foundation member

I tested the two multiple select menu examples on that same page on Chrome, FF, IE on Windows. I should have mentioned that when submitting the issue, sorry. I just tested on Chrome and FF on Ubuntu... same issue.

@toddparker Could it be you missed that I was talking about multiple selects, not custom select menus in general?

The multiple select menu can be opened with enter, but arrow keys only scroll the window. The issue is that the menu (modal or dialog) does not get focus when opened. Focus is still on the button.

The issue with tab goes for all type of custom select menus (modal or dialog).
If you hit tab (by accident or because you think it can be used to walk true option list) you can't get the focus back on the option list and the up/down arrow key get their scrolling functionality. If there is a close/back button in the header you can 'tab' to it and close the menu.
Biggest problem is when the menu doesn't have a close button. In that case there is no way to close the menu anymore with keyboard after the tab key has been pressed.
The behaviour of the tab key is expected because it skips to next link and the options in the list are not links. Maybe it is possible to realize that the up/down arrow key bring back focus to the option list. In general I think it would be a good idea when the escape key gets a 'close menu' functionality.

jQuery Foundation member

Refering to New Popup widget #3218 since that is going to replace the modal/dialog currently used for (multiple) select menus.
Closing the menu with escape will be covered. Get focus (back) on menulist is something that needs to be tested with new widget.

Update: refering to new ticket #4329

jQuery Foundation member

Closing since this is covered by #2327

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.