将jquery自动完成动态文本框绑定到json

Question

我已经完成了一堆搜索，但似乎无法获取任何地方。

我有一些JSON看起来像

[{"IngredientId":1,"IngredientName":"Butter","CategoryID":1},{"IngredientId":2,"IngredientName":"Sugar","CategoryID":1},{"IngredientId":3,"IngredientName":"Water","CategoryID":1},{"IngredientId":4,"IngredientName":"Salt","CategoryID":1}] 

我试着做两件事情。 1.以某种方式存储来自所选自动完成文本框的IngredientId并且是最重要的。将自动完成绑定到上面的json。

这是我的一个绑定的值跛脚尝试

.autocomplete({ 
     source: ingredients, 
     select: function (item) { 
      console.log(item.IngredientId); 
      return item.IngredientName; 
     } 

有人可以帮忙用正确的方式应该是我结合自动完成？

谢谢

Answer 1

source属性需要普通数组或对象的阵列（或字符串）。与一系列对象一起应该是{ 'value': 'some_val', 'label': 'some_label' }类型。

如果您无法控制该配料阵列，则应该将其映射为自动完成。

var ingredients_ac = $.map( 
    ingredients, 
    function(obj) { 
     return { value: obj.IngredientId, label: obj.IngredientName }; 
    }); 

然后使用新的阵列自动完成

.autocomplete({ 
     ... 
     source: ingredients_ac, 
     ... 
     } 
);