react-typeahead icon indicating copy to clipboard operation
react-typeahead copied to clipboard

tab is always prevented

Open magalhas opened this issue 9 years ago • 6 comments

I think the behaviour behind the TAB key is not good as it is... When I press tab the component picks the first option, which is nice, but if I press tab again I should go to the next focusable element in HTML. Moreover, I think this should happen when you hit TAB the first time.

What are your thoughts?

magalhas avatar Jul 30 '15 17:07 magalhas

I'd like to see either of these suggestions implemented.

clalimarmo avatar Oct 22 '15 19:10 clalimarmo

I've got this implemented in #111 and I'm using it as of now.

magalhas avatar Oct 22 '15 19:10 magalhas

You could do something like this. It's not pretty, but it will get you moving forward in a bind.

document.addEventListener("keydown", function(e) {
    var parent = $(e.target).parent();
    if (e.which === 9 && parent.hasClass('typeahead')) {
        // Ignore it. Typeahead gobbles up tab, which sucks.
        e.stopImmediatePropagation();
    }
}, {capture: true});

eeiswerth avatar Sep 12 '16 20:09 eeiswerth

Are either of the mentioned PR's going to be merged? I would like to TAB to other input fields after a selection is made also.

twuerker avatar Jun 21 '17 16:06 twuerker

@twuerker - I'd like to pick @clalimarmo's #140, which has docs but a merge conflict. Ideally there would be a short test case as well.

If either of you update the PR, I'm more than happy to merge it in.

fmoo avatar Jun 21 '17 16:06 fmoo

I think that regardless of the caret navigation, the tabbing shouldn't exist as currently you can't tab through even if you've selected an item. The arrow key navigation should be purely up/down/enter and shouldn't be messing with the tabbing. It's the most logical solution and the most intuitive one. Any progress on this?

stavlocker avatar Oct 11 '18 08:10 stavlocker