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

我认为你必须使用label和value属性构建一个json对象：

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

Jquery自动完成不显示数据

1 个答案: