预先输入的建议列表没有减少

Question

我正在尝试植入推特typeahead.js

https://github.com/corejavascript/typeahead.js

但是建议列表并没有减少....

HTML 代码：

<div class="container">
    <form action="" method="POST">
        <div class="typeahead-wrapper">
            <input type="text" id="my_search" name="search" autocomplete="off" placeholder="Enter Country Code"/>
            <input type="submit">
        </div>
    </form>
</div>

Javascript代码

$(document).ready(function($) {
  var cities_suggestions = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace("DESIGNATION"),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    remote: {
      url: "villes2.json",
      transform: function(data) {
        var newData = [];
        data.forEach(function(item) {
          newData.push(item.DESIGNATION);
        });
        console.log(newData);
        return newData;
      }
    }
  });

  cities_suggestions.initialize();

  $("#my_search").typeahead(
    {
      hint: true,
      minLength: 1,
      highlight: true
    },
    {
      name: "cities",
      source: cities_suggestions, // suggestion engine is passed as the source
      limit: 10
    }
  );
});

我的 Json 文件看起来像这样：

[
  {
    "CODE_INSEE": 1344,
    "DESIGNATION": "1000 SAINT-DENIS-LES-BOURG"
  },
  {
    "CODE_INSEE": 1053,
    "DESIGNATION": "1000 BOURG-EN-BRESSE"
  },
  {
    "CODE_INSEE": 1225,
    "DESIGNATION": "1090 LURCY"
  },
  {
    "CODE_INSEE": 1165,
    "DESIGNATION": "1090 FRANCHELEINS"
  },
  {
    "CODE_INSEE": 1263,
    "DESIGNATION": "1090 MONTMERLE-SUR-SAONE"
  },
  {
    "CODE_INSEE": 1169,
    "DESIGNATION": "1090 GENOUILLEUX"
  }
]

我还有 json 文件的前十个建议和其他任何东西 console.log(NewData) 没问题

Answer 1

我找到了

$(document).ready(function($) {
var cities_suggestions = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('text'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    prefetch: 'villes2.json',
    remote: {
        url: 'villes2/queries/%QUERY.json',
        wildcard: '%QUERY'
  },
});
cities_suggestions.initialize();
// init Typeahead
$('#my_search').typeahead(
{
    hint: true,
    minLength: 1,
    highlight: true
},
{
    name: 'cities',
    display: 'text',
    source: cities_suggestions,   // suggestion engine is passed as the source
    limit: 10,
});
// then fill hidden input for get the value :-)
$('#my_search').bind('typeahead:select', function(ev, suggestion) {
    $('#my_search_value').val(suggestion.value)
});

});

预先输入的建议列表没有减少

typeahead suggestions list not decreasing

typeahead.js

bloodhound