Skip to content
This repository has been archived by the owner on May 29, 2019. It is now read-only.

When using Enter to select item in typeahead, Enter keydown event bubbles up. Why is stopPropagation not used? #4459

Closed
mjohnson1122 opened this issue Sep 24, 2015 · 9 comments

Comments

@mjohnson1122
Copy link

I have a typeahead being used as a search entry field. You type in search terms and use the typeahead to quickly formulate search phrases. You then use the Enter key to submit the search. This works fine until using the arrow keys and enter to select an item from the typeahead dropdown. When this happens, my search is executed in addition to the typeahead dropdown closing.

I guess I'm wondering why the Enter event is bubbled up when used in this fashion. I guess I was expecting a stopPropagation to prevent this from happening when selecting an item from the typeahead dropdown via a keyboard Enter.

@mjohnson1122
Copy link
Author

And actually, stopPropagation is used for the Escape key... why not the Enter key?

@wesleycho
Copy link
Contributor

I guess the real question would be what side effects does stopping propagation on the enter (or tab) key have here? I'm not against adding a stopPropagation necessarily, but this would be a potentially breaking change.

@wesleycho
Copy link
Contributor

Thinking about this some more, escape has relevance when it comes to modals and other components with expected behavior with escape. Enter does not have that sort of interop, and a simple binding with ng-keypress or ng-keydown would allow a user to stop propagation if desired.

I am closing as a won't support, as it's a breaking change with no real particular benefit.

@deeg
Copy link
Contributor

deeg commented Jan 7, 2016

Could we at least get access to the event object in the onSelectCallback?

Without it I could use the $window.event object, but that does not work the same in all browsers.

The issue I'm also having is pressing "Enter" to select something from the autocomplete, is also firing another event which I do not want it to. I want the user to have to hit "Enter" twice.

@wesleycho
Copy link
Contributor

If you would like to open a PR implementing support in a nice manner along with the appropriate unit tests, I would be fine with it. It shouldn't be a particularly difficult task if you'd like to take a stab at it.

@deeg
Copy link
Contributor

deeg commented Jan 7, 2016

Sounds good, will do if I cannot find another elegant solution.

@mjohnson1122
Copy link
Author

I fixed on my end by wrapping the typeahead in my own directive. That way I could get the Enter key and stopPropagation on it myself.

@deeg
Copy link
Contributor

deeg commented Jan 7, 2016

Great, thanks for the info @mjohnson1122 !

@deeg
Copy link
Contributor

deeg commented Jan 7, 2016

I created pull request #5165 for this.

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

No branches or pull requests

3 participants