2012-01-16 134 views
1

我正在使用自动完成jquery json,但它没有显示结果。 有以下代码我正在使用。Jquery自动完成不显示数据

$(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":"[email protected]","FirstName":"Sobha","Id":12333,"LastName":"Marati"}] 

回答

0

我认为你必须建立一个JSON对象与labelvalue属性:

{[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方法并使用新属性自己构建菜单项。