jQuery几乎赢得了我 - UI自动完成“数据未定义”

jQuery几乎赢得了我。我已经在StackOverflow答案中看到了很多，但我找不到解决问题的方法。

我在我的项目中使用 jQuery UI 自动完成功能，如果没有返回任何结果，我需要渲染默认消息。我正在使用"_renderItem"，正如您在下面看到的。

var autocompleteDir = $("#search");
autocompleteDir.autocomplete({
    source: function (request, response) {
        populate(request.term, response);
        result = $.ui.autocomplete.filter(result, request.term)
        var item = {};
        item.type = 'loading';
        item.label = "Loading..";
        item.value = "";
        result.unshift(item)
        response(result.slice(0, 10));
    }
});
autocompleteDir.data("ui-autocomplete")._renderItem = function (ul, item) {
    if (item.type === "loading") {
        return $('<li></li>')
            .data("ui-autocomplete-item", item)
            .append("<div style='text-align: center;'>" + item.label + "</div>")
            .appendTo(ul);
    }
};

这是我在控制台上得到的内容：

Uncaught TypeError: Cannot read property 'type' of null
Uncaught TypeError: Cannot call method 'data' of undefined 

我正在使用jQuery 1.10.2和jQuery UI 1.10.3。有人有好主意吗？

编辑 1：

如果我在"源"之前使用它：

response: function(event, ui){ 
                    if (ui.item.type === "loading"){
                        ui.content.push({label:"Loading",value:"Loading"})
                    }
                } 

我有以下错误：

Cannot read property 'type' of undefined 

如果您帮助我解决此问题，我可以使用"响应"来格式化和样式我的"加载"和"无"结果吗？

编辑 2

var populate = function(term, response) {
        $.getJSON(
            '<%= my_rails_path %>.json',
            {search: term},
            function(json) {
                  var result = [];
                  $.each(json, function(key, value) {
                    var item = {};
                    item.type = '';
                    item.label = value.name;
                    item.value = value.name;
                    result.push(item);
                  })
                  if (result.length == 0) {
                    var item = {};
                    item.type = "noResult";
                    item.label = "Create '" + term + "'"; 
                    item.value = term;
                    result.push(item)
                  }
                  response(result);
            }
        );  
};

编辑 3

现在问题解决了，但标签从字面上显示出来，但我希望渲染它。查看代码，您将了解：

 response: function(event, ui){ 
          for(var i in ui.content){
            if (ui.content[i].type==="loading"){
                  ui.content[i] = {
                         label:"<div style='text-align: center;'>Loading</div>",
                        value:""
                                   }
            }
          }
 }

而是在 ui 中间呈现"加载"，所有字符串都显示给用户（加载）。