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

Allow selecting origin/destination from suggestions by with Tab? #4292

Open
datarttu opened this issue Jul 7, 2021 · 1 comment
Open

Allow selecting origin/destination from suggestions by with Tab? #4292

datarttu opened this issue Jul 7, 2021 · 1 comment

Comments

@datarttu
Copy link

datarttu commented Jul 7, 2021

When I'm typing my origin or destination in the text fields, and I'm provided a list of suggestions, I'd find it intuitive to hit the Tab button when the correct suggestion is focused, and this action would confirm that suggestion as the origin / destination and take my focus to the next UI element. However, hitting the Tab when in the suggestion list only leaves the text field empty and removes the focus. This is what happens in HSL Reittiopas when typing and then trying to select and proceed with Tab:

Peek 2021-07-07 14-30

I've also tested with this https://jyvaskyla.digitransit.fi/, same issue there.

Everything works just as expected when I use Enter instead of Tab, and I think it's fine - Tab completion & focus change just seems to be standard behaviour on many common sites so it feels a bit weird that Reittiopas & Digitransit are missing this UI behaviour. Would it be possible to allow using Tab here?

@datarttu
Copy link
Author

datarttu commented Jul 9, 2021

Some more info: it seems that the current behaviour depends on the react-autosuggest component. There has been a lot of discussion and still no consensus about the expected Tab behaviour, see this PR.

Hope this can be still considered here from the UX perspective, however I find it understandable if adding the Tab behaviour I suggested would bring too much custom code on top of the original component.

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

No branches or pull requests

1 participant