Jquery自動完成不顯示數據

Question

我正在使用自動完成jquery json，但它沒有顯示結果。 有以下代碼我正在使用。

$(function() { 

    $("#course").autocomplete({ 
     source: function(request, response) { 
      $.ajax({ 
       url: "ajax.php", 
       dataType: "json", 
       data: { 
        style: "full", 
        maxRows: 20, 
        name_startsWith: request.term 
       }, 
       success: function(data) { 
        response($.map(data.geonames, function(item) { 
         return { 
          Id: item.Id + (item.FirstName ? ", " + item.LastName : "") + ", " + item.Email, 
          value: item.Id 
         } 
        })); 
       } 
      }); 
     }, 
     minLength: 2, 
     select: function(event, ui) { 
      log(ui.item ? 
       "Selected: " + ui.item.label : 
       "Nothing selected, input was " + this.value); 
     }, 
     open: function() { 
      $(this).removeClass("ui-corner-all").addClass("ui-corner-top"); 
     }, 
     close: function() { 
      $(this).removeClass("ui-corner-top").addClass("ui-corner-all"); 
     } 
    }); 
}); 
</script> 

以這種格式生成Ajax文件。

 [{"Email":"shobaprashanth@gmail.com","FirstName":"Sobha","Id":12333,"LastName":"Marati"}] 

Answer 1

我認爲你必須建立一個JSON對象與label和value屬性：

{[label: 'text', value: 'val']...} 

，因爲菜單項目的默認渲染方法是：

_renderItem: function(ul, item) { 
    return $("<li></li>") 
     .data("item.autocomplete", item) 
     .append($("<a></a>").text(item.label)) 
     .appendTo(ul); 
} 

如果你想提供另一個json對象作爲數據源，您必須提供一個新的_renderItem方法並使用新屬性自己構建菜單項。