json - 带有自动完成问题的 jQueryUI Ajax 调用 - JSON 正确吗？从旧的自动完成迁移

Question

我有以下使用旧 Bassistance 自动完成功能的函数:

    $('#searchLocation').autocomplete("/Utils.aspx", {
        dataType: 'json',
        minChars: 2,
        selectFirst: false,
        parse: function (data) {
            var rows = new Array();
            for (var i = 0; i < data.length; i++) {
                rows[i] = { data:data[i], value:data[i], result:data[i] };
            }
            return rows;
        },
        formatItem: function (row, i, n) {
            return row;
        }
    });

以上内容正常工作，即为每个结果生成 LI，并在输入 $('#searchLocation') 的正下方生成一个下拉列表。

我需要迁移到新的 jQuery UI 自动完成，到目前为止我有以下内容:

$("#searchLocation").autocomplete({
        source: function( request, response ) {
            var area = $("#searchLocation").val();
            $.ajax({
                url: "/Utils.aspx",
                dataType: "json",
                data: {'q':area},
                success: function (data) {
                    console.log(data);
                    var rows = new Array();
                    for (var i = 0; i < data.length; i++) {
                        rows[i] = { data:data[i], value:data[i], result:data[i] };
                    }
                    return rows;
                }
            });
        },
        minLength: 2
    });

数据/JSON 的形式如下:

["CM23 ","CM23 1 ","CM23 2 ","CM23 3 ","CM23 4 ","CM23 5 "]

但是，UL 并没有被 LI 所填充。没有错误 - 它只是不起作用。

我缺少什么 - 我需要编写创建 LI 的代码吗？我尝试了以下方法，但不起作用:

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

任何帮助都会很棒。

Answer 1

由于您的远程方法返回字符串数组中的数据，因此以下内容应该可以正常工作(无需进行后处理):

$("#searchLocation").autocomplete({
        source: function( request, response ) {
            $.ajax({
                url: "/Utils.aspx",
                dataType: "json",
                data: {'q':request.term},
                success: response
            });
        },
        minLength: 2
});

关键是在 AJAX 成功方法中调用传递的 response 函数(因为您不需要任何后处理，因此可以使用 response 函数作为您的直接AJAX成功方法)。