symfony2.7，猎犬，预输入不显示自动完成答案

【问题标题】：symfony2.7, bloodhound, typeahead not showing autocompletesymfony2.7，猎犬，预输入不显示自动完成
【发布时间】：2015-11-16 10:42:58
【问题描述】：

我正在尝试在 symfony 2.7 中使用 typeahead 来使用 LIKE 进行数据库搜索。我已经阅读了 typeahead 的文档，并根据他们网站上的示例，我将一个小示例放在一起，看看它是如何工作的。由于我在执行搜索的表中有大约 1300 个条目，因此我生成了一个 json 文件，其中包含所有用于性能的条目。问题是 typeahead 没有显示来自远程或预取的任何信息，我不明白为什么它不起作用，因为我没有对示例中的原始代码进行太多更改。目前生成的结果包含来自示例页面的虚拟数据，因为我认为从远程返回的结果有问题。也许我错过了一些东西，我看不到解决方案。我检查了控制台，没有收到任何错误，bloodhound 在 typeahead 之前加载，两者都加载正常，js 文件在它们之后加载并显示内容。

Javascript 文件：

    var url = Routing.generate('ajax_search', {name: 'query'});
// Trigger typeahead + bloodhound
var products = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    prefetch: '/json/result.json',
     remote: {
      url: url,
      wildcard: 'query'
    }
});

products.initialize();

$('#products_forms .typeahead').typeahead({
    name: 'product',
    displayKey: 'value',
    source: products.ttAdapter()
});

html 测试文件

{% extends '::base.html.twig' %}
{% block body %}
<div class="col-sm-10" id="product">
    <input type="text" placeholder="Product" id="product" name="product" class="form-control typeahead">
</div>
{% endblock %}

php生成的虚拟文件

cat result.json

            {"stateCode": "CA", "stateName": "California"},
            {"stateCode": "AZ", "stateName": "Arizona"},
            {"stateCode": "NY", "stateName": "New York"},
            {"stateCode": "NV", "stateName": "Nevada"},
            {"stateCode": "OH", "stateName": "Ohio"}

【问题讨论】：

标签： symfony typeahead.js bloodhound

【解决方案1】：

好像是这样的：

javascript：

$(document).ready(function() {
    var url = Routing.generate('ajax_search', {name: 'WILDCARD'});
    // Trigger typeahead + bloodhound
    var products = new Bloodhound({
        datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        identify: function(obj) { return obj.team; },
        prefetch: 'json/result.json',
        remote: {
          url: url,
          wildcard: 'WILDCARD',
        }
    });

    products.initialize();

    $('#products_forms .typeahead').typeahead({
      minLength: 3,
      highlight: true
    },
    {
      name: 'product',
      display: 'team',
      source: products.ttAdapter()
    });
});

【讨论】：