Skip to content
This repository has been archived by the owner on Apr 5, 2023. It is now read-only.

Proposal to implement proper tab focus #134

Open
acechase opened this issue Oct 29, 2014 · 3 comments
Open

Proposal to implement proper tab focus #134

acechase opened this issue Oct 29, 2014 · 3 comments

Comments

@acechase
Copy link

For the select component in particular, when used in a form the select box is not tab-able. I believe all we need to do to change this:

  • Add "tabindex=0" to the tag within the select component template
  • Add an onblur event to detect loss of focus from the component and hide the dropdown (similar to the body onclick event that currently hides it)

Make sense? I can do this work myself, but wanted to make sure there wasn't something I was missing...

@azirbel
Copy link
Contributor

azirbel commented Oct 29, 2014

This is definitely something we want. @thangdinh has been looking at similar issues recently - Thang, do you have any feedback on this proposal?

Thanks for offering to work on this! If you can make it work I think a bunch of people will be happy.

@thangdinh
Copy link
Contributor

@acechase I wonder if you fixed the problem. I had a chance to look at the component today and found that we just have to change the tabindex back to 0 as you suggested and change the keyDown event a bit by checking if it is the TAB key, we shouldn't show dropdown. Then make the TAB key event call hideDropdown similar to escapePressed. I will also call preventDefault when ESC pressed to prevent it from closing its parent modal/popover.
If you haven't fixed it, I can push mine. Thanks.

@acechase
Copy link
Author

acechase commented Nov 9, 2014

@thangdinh - no, I haven't had a chance to work on it since my first report. Please, by all means, push yours! :-)

Cheers,
Andrew

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Development

No branches or pull requests

3 participants