jQuery UI自動完成未定義

Question

$(function() {
    $("#restaurant_name_search").autocomplete({
        source: function(d, e) {
            $.ajax({
                type: 'GET',
                url: api_url + 'searchrestuarant/' + encodeURIComponent(d.term),
                success: function(b) {
                    var c = [];
                    b = JSON.parse(b);
                    $.each(b, function(i) {
                        i.label = i.Restaurant_Name;
                        c.push(i);
                    });
                    e(c);
                }
            })
        },
        select: function(a, b) {
            console.log(b);.
        }
    }).data("ui-autocomplete")._renderItem = function(ul, item) {
        return $("<li></li>")
            .data("item.autocomplete", item)
            .append("<a>" + item.label + "</a>") // <---
            .appendTo(ul);
    };
});

這是我的jQuery用戶界面調用。

json輸出如下：

[{
    "Restaurant_Key": "1",
    "Restaurant_Name": "Altitude Espresso",
    "Email": "",
    "Phone_1": "",
    "Local_Restaurant_Key": "1",
    "Address_Line1": "163 Oriordian Street",
    "City": "Mascot"
}]

但總是自動完成顯示未定義。

從url接收輸出。

Answer 1

$.each的第一個參數是索引，因此您的代碼應為：

 var c = [];
 b = JSON.parse(b);
 $.each(b, function(index, item) {
   item.label = item.Restaurant_Name;
   c.push(item);
 });

但是，與其手動創建數組並更改原始對象，不如使用$.map更好：

var c = $.map(b, function(item, index) {
   return {label : item.Restaurant_Name};
});

在這種情況下，參數的順序就是您所期望的。