Material-ui: drop down menu get keyboard focus

Created on 28 May 2015  路  11Comments  路  Source: mui-org/material-ui

When tabbing through a form or page and the tab order shifts onto a Drop Down menu it should get focus and open with the currently selected Index item selected in the menu.

Currently Drop Down Menus don't interact at all when tabbing through controls

Most helpful comment

+1, I am using 0.16.0 and I am still not able to select a SelectField component when tabbing through the navigable components on the page. Pressing the Tab key always skips the SelectField components. Please reopen this issue and address it. It is very annoying to our users.

All 11 comments

We'll address this with #51

Thanks @codeuniquely - Fixed with SelectField in #846

As of the latest version of Material UI I'm still not getting keyboard focus on the SelectField. When tabbing it skips over the select field and goes straight to the next textfield / button. Is that expected behavior?

@hai-cea I am unable to select the DropDownMenu by tabbing through the page. If I don't pass "tabIndex={ 0 }", it skips over the component. With tabIndex, I can't open the dropdown menu with enter, arrows, or spacebar. The :active css selector applies on selection via tab. Tabbing through the items of the dropdown works well once the dropdown is open. This is true for 0.14.4 and 0.15.0-alpha.1 as well.

if one could trigger a click on it when it's onFocus it would look right. haven't found a way to do this.

I'm also unable to focus SelectField using the keyboard on Material-UI v0.15.0-alpha.1

Does anyone has any workaround regarding forcing dropdown respond on tabkey?
It doesn't work for me in 0.15.2

I am also wondering if there is a workaround. It is pretty annoying when it just skips the SelectField while tabbing through the fields. For [email protected] tabbing does not work.

+1, it seems this issue has been addressed but not properly fixed in the latest release. I'm on 0.15.3. @hai-cea

+1, I'm on 0.15.4 and the SelectField is being skipped when I tab through the UI.

+1, I am using 0.16.0 and I am still not able to select a SelectField component when tabbing through the navigable components on the page. Pressing the Tab key always skips the SelectField components. Please reopen this issue and address it. It is very annoying to our users.

Was this page helpful?
0 / 5 - 0 ratings