title: TypeAhead.js and Bloodhound showing an odd number of results
body: <p>I have a TypeAhead/Bloodhound implementation in my frontend, that fetches JSON-data from a Play/Scala-server. Typeahead-version is 0.11.1. The implementation is as follows:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="typeahead" class="col-md-8"&gt;
     &lt;input class="typeahead form-control"  type="text" placeholder="Select the user"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>var engine = new Bloodhound({
    datumTokenizer: function (datum) {
      var fullName = fullName(datum);
      return Bloodhound.tokenizers.whitespace(fullName);
    },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    identify: function(obj) { return obj.id; },
    remote: {
      url: routes.controllers.Users.index("").url,
      cache: false,
      replace: function (url, query) {
          if (!isEmpty(query)) {
              url += encodeURIComponent(query);
          }
          return url;
      },
      filter: function (data) {
          console.log(data);
          return $.map(data, function (user) {
              return {
                  id: user.id,
                  fullName: viewModel.fullName(user)
              };
          });
      }
  }
  });
  
  // instantiate the typeahead UI
  $('#typeahead .typeahead')
  .typeahead({
      hint: true,
      highlight: true,
      minLength: 1,
  },
  {
      name: 'engine',
      displayKey: 'fullName',
      source: engine
  })
  
  function fullName(data) {
    if (data === undefined) return "";
    else {
      var fName = data.firstName === undefined ? "" : data.firstName;
      var lName = data.lastName === undefined ? "" : data.lastName;
      return fName + ' ' + lName;
    }
  };
  </code></pre>
  
  <p>JSON-response the server gives:</p>
  
  <pre><code>[{"firstName":"Test","lastName":"User", "id":1}, ... ]
  </code></pre>
  
  <p>The server pages the result so that it gives maximum of 5 results, which is supposed to be the default limit for Typeahead/Bloodhound as well.</p>
  
  <p>The problem is that when the server returns 5 results, Typeahead shows 0 results in the overlay. If the server gives 4 results, TypeAhead shows 1 in the overlay. If the server gives 3 results, TypeAhead shows 2 results. For 2 and 1 results it shows the correct number of elements in the overlay. If I remove the page length and the server returns over 10 results, then TypeAhead shows 5 results (the limit). console.log inside the filter shows the correct number of data-results, so they go to Bloodhound at least.</p>
  
  <p>What might be the issue with this code? This TypeAhead-field is the only TypeAhead-field present in this page. I checked the DOM, and TypeAhead generates wrong amount of result-set fields, so it's not a problem with CSS (tried to remove all custom CSS as well). </p>
  
  <p>Thanks for any replies :)</p>