Typeahead Twitter only shows some items returned by the bloodhound

I use Bloodhound to retrieve data from the database, then twitter typeahead to display the options below the search box.

Currently, part of the snoop finds the required objects, but typeahead does not display them.

 var artist_retriever = new Bloodhound({
    // turns input query into string of tokens to send to database.
    queryTokenizer: Bloodhound.tokenizers.whitespace,

    remote: {
              // URL to fetch information from
              url: "/artists?query=%QUERY",
              wildcard: '%QUERY',
              // Manipulate the array of artists returned, for display to user.
              transform: function(array_of_artists){
                            // array of artists is returned from DB.
                            // Put each artist into a readable string
                            array_of_artists = create_artist_descriptions(array_of_artists)

                            console.log(array_of_artists)
                            // Returns correctly:
                            // [
                            //   { artist: "Joe" },
                            //   { artist: "Bob" },
                            //   { artist: "Smith" },
                            //   { artist: "Tom" },
                            // ]

                            return array_of_artists
                          }
            },

    // turns return value into a string of results, with this 'key' before each result.
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('artist'), 


  });

// display:



// instantiate the typeahead UI
  // https://github.com/twitter/typeahead.js/blob/master/doc/jquery_typeahead.md
  searcher = $('.typeahead').typeahead(
    // options:
    {
      hint: false
    },
    // datasets:
    {
      // Where to get data: User the bloodhound suggestion engine:
      source: artist_retriever.ttAdapter(),
      // Which attribute of each result from the database should be shown:
      displayKey: 'artist',
      templates: {
                    notFound: new_artist_option_template(),
                    footer: new_artist_option_template()
                 }
    }
  )

Update

Turns out there is a weird bug in typeahead. It seems to work only with the "limit" attribute set to a maximum of 4. If you set the "limit" to 5, typeahead does not give anything.

searcher = $('.typeahead').typeahead(
    // options:
    {
      hint: false
    },
    // datasets:
    {
      // Where to get data: User the bloodhound suggestion engine:
      source: artist_retriever.ttAdapter(),
      // Which attribute of each result from the database should be shown:
      displayKey: 'signature',
      limit: 4, // This can do a max of 4! Odd.
      templates: {
                    notFound: new_artist_option_template(),
                    footer: new_artist_option_template()
                 }
    }
+4
source share
1 answer

This issue has been resolved. See update 2 directly.

I reproduced this problem in this JSFIDDLE .

, . , , limit:4.

FIDDLE, , , number of results returned = value in limit.

FIDDLE, : . 1947 5 .

4: 1947 4 .

5: 1947 .

6: 1947 - .


, 1 , .

github. , .

1:

SO . "Luciano García Bes" , , . , .

:

, , .

, 1723 1724, :

that._append(query, suggestions.slice(0, that.limit - rendered));
rendered += suggestions.length;

2:

​​ 1212. 1312. ​​, update 1.

+2

All Articles