Question

我有自动完成工作但有错误。我如何正确格式化响应代码？
响应代码：

{
    label: "Label 1",
    value: "27"
},
{
    label: "Label 2",
    value: "18"
},
{
    label: "Dave",
    value: "25"
},
{
    label: "Jacqui Potatoes",
    value: "17"
}

Javascript ：

$("#account_search .ac_input").autocomplete({ 

    minLength: 0,
    source: base_url + "accounts/ac_results/account_name",    
    dataType: "json",
    type: "POST",

}).data( "autocomplete" )._renderItem = function( ul, item ) {

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

我认为.data()函数是问题，尽管它以某种方式工作。我想访问标签和值

Answer 1

_renderItem函数中出现错误（您应该在新创建的.data上调用<li></li>）：

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

我还用item.desc替换了您的JSON回复中不存在的item.value。

作为旁注，您可能根本不需要覆盖该功能。如果您想要更改每个项目在建议列表中的显示方式，则只需使用它。

另外，请确保删除options对象中的额外逗号。此外，选项dataType和type无论如何都不是有效选项：

$("#account_search .ac_input").autocomplete({ 
    minLength: 0,
    source: base_url + "accounts/ac_results/account_name"
});

示例（本地数据源）：http://jsfiddle.net/nG8Q4/

如何使用Codeigniter获取Jquery-ui自动完成功能以显示响应文本

1 个答案: