Search code examples
javascriptjquerytypeahead.jstwitter-typeahead

Typeahead.js remote works, but prefetch doesn't


I'm using typeahead.js 0.10.5 in my web app. For some bizarre reason, fetching suggestions live via remote works, while prefetch is broken. There's something non-obvious and strange going on here. According to the dev console and Chrome's network monitor, it isn't even making a query on page load. It does, of course, make a query when I start typing.

This really has me stumped- what am I doing wrong here?

    // Instantiate the Bloodhound suggestion engine
    var tags = new Bloodhound({
      datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
      queryTokenizer: Bloodhound.tokenizers.whitespace,
      remote: {
        url: '/tags/tags/search.json?q=%QUERY',
        filter: function (taglist) {
            // Map the remote source JSON array to a JavaScript object array
            return $.map(taglist, function (tag) {
                console.log(tag);
                return {
                    value: tag.tag
                };
            });
        }
      },
      prefetch: {
        url: '/tags/tags/search.json?q=',
        filter: function (taglist) {
            // Map the remote source JSON array to a JavaScript object array
            return $.map(taglist, function (tag) {
                console.log(tag);
                return {
                    value: tag.tag
                };
            });
        },      
      }
    });

    // Initialize the Bloodhound suggestion engine
    tags.initialize();

    // Instantiate the Typeahead UI
    $('#search-tags').typeahead(null, {
        displayKey: 'value',
        source: tags.ttAdapter(),
        hint: true,
        highlight: true
    });

Solution

  • Try deleting the entries from your browser's localStorage and starting again.