推特类型

时间:2013-08-15 18:24:45

标签: twitter typeahead

问题#1:

我有以下代码:

// NOTE: Initiate auto-complete
  $('#edit-keyword').typeahead({
    remote: '/products/autocomplete.json/%QUERY', 
    wildcard: '%QUERY'
  }).bind('typeahead:selected', function(object, datum) {
    console.log(object);
  });

我从服务器返回此JSON:

1: "Bustello Cafe Coffee Regular"
110: "Barista Prima Coffeehouse Coffee Pods K Cups Darkest Roast French Roast"
713: "Bolthouse Farms Protein Plus Coffee"
5680: "Bustello Cafe Coffee Regular"
5693: "Bustello Cafe Coffee Regular"

我将如何添加到上面的代码段中以检索与每个项目关联的ID ...现在'datum'只返回字符串值。

问题#2:

我刚注意到JSON返回多个具有唯一ID的“Bustello Cafe Coffee Regular”,但渲染的下拉列表似乎一次只显示一个 - 我认为在typeahead控件中有一个重复的副本?它在哪里???

亚历

1 个答案:

答案 0 :(得分:0)

如果需要,您可以使用typeahead:selectedtypeahead:autocompleted自定义事件来获取与每个项目关联的ID,但您的json需要适当的ID属性。例如:

[{"ID":111, "Name":"blah"},{"ID":222, "Name":"buuu"}]

使用jquery和typeahead这样的东西:

    $("#edit-keyword").on("typeahead:selected typeahead:autocompleted",
        function(e, datum) {
            // datum containts datum.ID here, do what you want with it
            //.. i.e. assign to a hidden input or knockout observable, etc.
        }
    );

至于你的重复问题,我还没有看到它的配置,如果它们还没有,那么typeahead将尝试将你的数据转换为预先存在的数据,所以它可能是typeahead中的_transformDatum函数这一点。

我建议您尝试将数据结构化为一个预先确定的数据,以避免这种情况,看看会发生什么,请参阅https://github.com/twitter/typeahead.js#datum了解它们的结构,在您的情况下,值为{{1}并且您需要指定适当的object属性。