Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make Hits widget focusable and let the user navigate with arrows keys #84

Closed
bobylito opened this issue Sep 12, 2015 · 9 comments
Closed

Comments

@bobylito
Copy link
Contributor

When I do a search, I would like, as a user to be able to browse the results with the arrows of the keyboard. What could be nice is that when I hit the the return key in the search field, the hits are focused and the first element is highlighted.

What do you think?

PS : yes I know, this is not standard / common but most of the websites just fail at doing basic keyboard interaction that I don't consider them as good examples.
PPS : but I would be very interested in using great keyboard experience
PPPS : yes vim bindings would a great easter egg ;)

@redox
Copy link
Contributor

redox commented Sep 12, 2015

Google implements that actually:

  • after doing a search, hit <TAB>
  • up/down :)
  • enter

@bobylito
Copy link
Contributor Author

And we want to be like google :D

In the version of google that I can acess I have to hit but it really feels great I think :)

@vvo
Copy link
Contributor

vvo commented Sep 12, 2015

Should be doable but maybe behind an option. Using https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/tabindex?

@bobylito
Copy link
Contributor Author

Yes tabindex will be needed to make a div focusable.

@pixelastic pixelastic added this to the backlog milestone Sep 28, 2015
@vvo vvo removed the enhancement label Oct 1, 2015
@vvo vvo removed this from the next milestone Oct 22, 2015
@vvo
Copy link
Contributor

vvo commented Nov 23, 2015

🐴 CLOSING BOT SAYS:

This is very old and not done, reopen if you have the need and want to fix it

@vvo vvo closed this as completed Nov 23, 2015
@Giovanni-Mattucci
Copy link

Giovanni-Mattucci commented Oct 21, 2016

I am looking for a solution to achieve this.

I've noticed this functionality was implemented in your autocomplete demos.

@vvo
Copy link
Contributor

vvo commented Oct 21, 2016

@Giovanni-Mattucci For now you will have to implement it on your side, via some JavaScript custom coding/tabIndex in your hits. This should be doable

@spoeken
Copy link
Contributor

spoeken commented Jun 26, 2020

Is there a sollution for this now?

@Haroenv
Copy link
Contributor

Haroenv commented Jul 8, 2020

if you are using connectHits, you can add keyboard handling there yourself for now

dhayab pushed a commit that referenced this issue Jul 10, 2023
…ature/mergeSearchParameters

FIX algolia/algoliasearch-helper-js#76 #84 Modify search parameters easily
dhayab pushed a commit that referenced this issue Jul 10, 2023
  * FIX : algolia/algoliasearch-helper-js#29 Avoid callback for outdated queries
  * FIX : algolia/algoliasearch-helper-js#64 Sum up the processing time of all queries
  * FIX : algolia/algoliasearch-helper-js#92 Parameters that can be set in the dashboard shouldn't have defaults
  * FIX : algolia/algoliasearch-helper-js#62 Make sure disctinct is set to false when it's not possible to use distinct in Algolia
  * FEATURE : algolia/algoliasearch-helper-js#91 Support for tags (with support for the raw format #98)
  * FEATURE : algolia/algoliasearch-helper-js#70 Ability to get all refined values : helper.getRefinements( facetname )
  * FEATURE : algolia/algoliasearch-helper-js#51 multiple filters for a single conjunctive facet (tests)
  * FEATURE : Ability to modify any parameter of the state easily (algolia/algoliasearch-helper-js#76 #84 #12)
  * FEATURE : algolia/algoliasearch-helper-js#69 Ability to know if a facet is refined, whatever the value
  * FEATURE : algolia/algoliasearch-helper-js#86 Expose SearchParameters, AlgoliaSearchHelper, SearchResults to users directly in the builds
  * FEATURE : algolia/algoliasearch-helper-js#25 let the user do a clearRefinement with a function as a filter
  * REFACTORING : SearchParameters is immutable (algolia/algoliasearch-helper-js#14)
  * REFACTORING : Ensure SearchParameters is totally frozen (algolia/algoliasearch-helper-js#14)
  * LIB : Update lodash version to 3.9.x
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

7 participants