Typeahead/Bloodhound only returns first search results and not new search?

196 views Asked by At

I've implemented Typeahead with Bloodhound to get remote JSON data and it works but when I delete what is in input and type something else the same results come up. I check the network in chrome dev tools and there is only one request, even if I delete and start typing again, no new request. How do I solve it? There should be a new request on keyup?

   var articles = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            remote: {
                url: '../fetch-article',
                wildcard: '%QUERY'
            }
        });


        $('#search-article .typeahead').typeahead(null, {
            name: 'articles',
            display: 'value',
            highlight: true,
            limit: Infinity,
            minLength: 3,
            source: articles,
            templates: {
                empty: [
                '<div class="empty-message">',
                    'Article not found',
                '</div>'
                ].join('\n'),
                suggestion: function(data) {
                    return '<div class="tt-suggest-page">' + data.title + '<br><a href="../copyright/' + data.slug + '">Read More</a></div>';
                }
            }
        });
2

There are 2 answers

0
Rahul Sharma On BEST ANSWER

Bloodhound caches the results from the first hit to the remote. It then tries to search only in the cached data for the second query you type in the text field and thus doesn't hit the remote again. You can tell bloodhound not to use cache for searching. This can be done using this configuration:

var articles = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
        url: '../fetch-article',
        wildcard: '%QUERY',
        cache: false        //set cache to false
    }
});

Ref: https://github.com/twitter/typeahead.js/issues/1525

0
H_H On

Bloodhound Typeahead cache the remote call by default and we have to configure the cache to false to call the remote URL again.

cache – If false, will not attempt to read or write to local storage and will always load prefetch data from url on initialization. Defaults to true.

You can see documentation here- https://github.com/twitter/typeahead.js/blob/master/doc/bloodhound.md#prefetch