jQuery UI自動完成選擇返回未定義

Question

我已經扎實地搜尋了幾個小時，但似乎無法弄清楚該怎么做。 我在JQuery UI 1.8.16中使用了自動完成的較舊版本。 在您悲傷地問之前，我無法升級它。 我試圖設置自定義數據顯示，所以我使用文檔中的“自定義數據”示例。 我的代碼以示例期望的格式正確構建，但是我添加了一些我需要的其他鍵。 我的結構看起來像我在此jsBin中提供的結構。 http://jsbin.com/zut/1/edit

我需要覆蓋選擇和焦點功能。 在遵循示例之后。 我為模板部分定義了此代碼。

        .data("autocomplete")._renderItem = function(ul, item) {
                var template;
                if (item.isActive === true) {
                    template = "<a>" + item.label + item.desc + item.status + "</a>";
                } else {
                    template = "<a >" + item.label + item.desc  + "<span class='inactive'>" + item.status 
                    + "</span></a>";
                }

                return $("<li>")
                    .append(template) // .append("<a>" + item.label + item.desc + "</a>")
                    .appendTo(ul);
        };
    },

這可以使模板正常工作，但是我在選擇和重點關注“ TypeError：ui.item is undefined”中收到“ ui”參數的“ undefined”

我嘗試將.data（“ autocomplete”）更改為.data（“ ui-autocomplete”），這將擺脫“ TypeError：ui.item未定義”的問題，但是現在所有其他模板數據都消失了，我只顯示標簽。

我放回去，然后使用._renderItemData與._renderItem搞混，結果與上面相同。 原始錯誤消失了，但是所有其他文本都消失了。

我不知所措，所有幫助將不勝感激！ 我只想顯示額外的自定義文本，同時仍然覆蓋選擇和焦點值。 到目前為止，我發現的所有“修復”似乎都解決了一個問題，但破壞了所有“自定義數據”。

Answer 1

您缺少將數據設置為li的設置

.data("autocomplete")._renderItem = function (ul, item) {
    var template;
    if (item.isActive === true) {
        template = "<a>" + item.label + item.desc + item.status + "</a>";
    } else {
        template = "<a >" + item.label + item.desc + "<span class='inactive'>" + item.status + "</span></a>";
    }

    return $("<li>")
        //missing this
        .data( "item.autocomplete", item )
        .append(template)
        .appendTo(ul);
};

演示： 小提琴

請參閱原始實現， 網址為http://code.jquery.com/ui/1.8.16/jquery-ui.js，此處已設置此數據值