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

"Searching" indicator #148

Open
francisjervis opened this issue Sep 29, 2022 · 0 comments
Open

"Searching" indicator #148

francisjervis opened this issue Sep 29, 2022 · 0 comments

Comments

@francisjervis
Copy link

francisjervis commented Sep 29, 2022

Is your feature request related to a problem? Please describe.
Users type inputs that are too long to effectively match, leading to "no results" being shown when a shorter query would have supplied the expected results. Users cannot tell there is a typeahead function on the search box because there is no "searching" indicator.

Describe the solution you'd like
Add a spinner or other indicator to the input, which is shown while results are being retrieved. Add a "searchIndicator" option to the options to turn it off if desired.

Describe alternatives you've considered
Write custom handlers implementing this. However this seems to be a universal UX pattern for autocomplete/typeahead elements, so it should be an "out of the box" option.

Additional context
Here's an example (thanks Codex!)

$('.advancedAutoComplete').autoComplete({
    resolver: 'custom',
    events: {
        search: function (qry, callback) {
            // let's do a custom ajax call
            var $this = $(this);
            var $thisGroup = $this.closest('.input-group');
            var $thisSpinner = $('<span class="input-group-addon"><i class="spinner-border spinner-border-sm"></i></span>');

            $thisGroup.append($thisSpinner);
            $.ajax(
                '<url>',
                {
                    data: { 'qry': qry}
                }
            ).done(function (res) {
                callback(res.results)

            $thisSpinner.remove();
            });
        }
    }
});
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