typeahead: Prevent lookup on backspace keyup event on searchbox.

This change was only required for the search pills enabled
search. As there is a valid use-case where the user might
want to remove just the latest pill(s) and then narrow.

This wasn't possible previously because, the typeahead was
looked up every time the backspace key was pressed. And since
the only way to narrow in search is through the enter key,
if the user entered it then the searchbox would get updated
with the first suggestion in the typeahead.
The alternative for the user would be to first lose focus on
the searchbox (by clicking outside) the focus again which
doesn't generate the typeahead. Then only the enter key would
be available for narrowing.

We do not display the typeahead after the search pills are
created. This is done just to match the behaviour for the
deletion of pills case too.

We use this approach and we don't just change the line
in `search.js` from  `helpOnEmptyStrings: true` to
`helpOnEmptyStrings: !page_params.searchpills enabled`
because we still need to provide suggestions for '',
on initial lookup or every time the empty input searchbox
with search pills present gains focus.
This commit is contained in:
Ryan Rehman
2020-06-17 19:33:50 +05:30
committed by Tim Abbott
parent 9038c7f28f
commit 897bfb8b95

View File

@@ -56,6 +56,19 @@
* You can set an on_escape hook to take extra actions when the user hits
* the `Esc` key. We use this in our navbar code to close the navbar when
* a user hits escape while in the typeahead.
*
* 5. Help on empty strings:
*
* This adds support for displaying the typeahead for an empty string.
* It is helpful when we want to render the typeahead, based on already
* entered data (in the form of contenteditable elements) every time the
* input block gains focus but is empty.
*
* We also have logic so that there is an exception to this rule when this
* option is set as true. We prevent the lookup of the typeahead and hide it
* so that the `Backspace` key is free to interact with the other elements.
*
* Our custom changes include all mentions of `helpOnEmptyStrings` and `hideOnEmpty`.
* ============================================================ */
!function($){
@@ -185,12 +198,12 @@
return this
}
, lookup: function (event) {
, lookup: function (hideOnEmpty) {
var items
this.query = this.$element.is("[contenteditable]") ? this.$element.text() : this.$element.val();
if (!this.options.helpOnEmptyStrings) {
if (!this.options.helpOnEmptyStrings || hideOnEmpty) {
if (!this.query || this.query.length < this.options.minLength) {
return this.shown ? this.hide() : this
}
@@ -378,7 +391,11 @@
if (!this.shown) return;
this.select(e);
}
this.lookup()
var hideOnEmpty = false
if (e.keyCode === 8 && this.options.helpOnEmptyStrings) { // backspace
hideOnEmpty = true
}
this.lookup(hideOnEmpty)
}
if ((this.options.stopAdvance || (e.keyCode != 9 && e.keyCode != 13))