typeahead.js icon indicating copy to clipboard operation
typeahead.js copied to clipboard

Add option changing TAB-key behaviour: Focus on the next tabindex, instead of selecting the top-suggestion

Open NoDark opened this issue 8 years ago • 11 comments

  • The default behaviour of the TAB-key in twitter/typeahead.js is to select the top suggestion
  • We introduced a new option called 'tabAutocomplete' which is NOT mandatory and defaults to true.
  • If the option 'tabAutocomplete' is true, the TAB-key will select the top suggestion as usual in twitter/typeahead.js
  • If the option 'tabAutocomplete' is NOT set, the TAB-key will select the top suggestion as usual in twitter/typeahead.js
  • Only if you set the option 'tabAutocomplete' to false pressing the TAB key will change the focus on the html-element with the next tabindex.
  • Added two methods for tabAutocomplete = true resp. false to test typeahead_spec.js

NoDark avatar Apr 19 '16 09:04 NoDark

I want this.

antoineleclair avatar Jul 14 '16 19:07 antoineleclair

Ditto. I currently have bloodhound returning an object of the form {"label":"some label", "value" : "some value"}. On tab (with the intention of focusing on the next input it writes the whole damn object to input.

I've got an onselect function with sets the input value to "label", and sets value as a data attribute. But that logic is thrown away with this tab. Turning off tab autocomplete would help!

anotherstarburst avatar Aug 28 '16 18:08 anotherstarburst

I also need this functionality. I have multiple input elements on a form, and am using a tab pattern that only makes selection menus available (but does not select an element). Tabbing, in my particular use case, should move off the typeahead input and to the next element in the form (without selecting anything).

pemigra avatar Oct 05 '16 19:10 pemigra

https://github.com/corejavascript/typeahead.js submit this here <<< they are becoming active again.

BallisticPain avatar Dec 05 '16 22:12 BallisticPain

https://codepen.io/Artistan/pen/LywrXj

This makes a dataset based on the current input query be the first option that is "auto" selected.

Artistan avatar Jun 05 '17 17:06 Artistan

Same here. In my app, the use of Tab makes it convenient to navigate around, therefore, it is used more (as opposed to clicking around). But when you get to the dropdown, the first option is automatically selected so you have to remove that first then select the one you want. It would be great if you can either use Tab to go down the list or to just get out of it.

kevb10 avatar Sep 28 '17 22:09 kevb10

@NoDark thank you, it's very useful, but for everyone can profit of the benefit of your work, you need to accept licence here https://cla-assistant.io/twitter/typeahead.js?pullRequest=1506

Thank you in advance

BGuimberteauMV avatar May 29 '19 14:05 BGuimberteauMV

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.
You have signed the CLA already but the status is still pending? Let us recheck it.

CLAassistant avatar Jul 18 '19 15:07 CLAassistant

The team developing https://pubmed.ncbi.nlm.nih.gov/ would also love to see this implemented. Let us know how we can help!

I'm seeing that the cla is not signed yet by @NoDark , or just someone with write access can merge it?

akinhwan avatar Feb 23 '21 18:02 akinhwan

Thanks @NoDark I made the modifications myself and this is exactly what I needed!

douglassdavis avatar Jul 19 '24 16:07 douglassdavis