如何在JQuery UI自动完成中使用source：function（）…和AJAX

Question

我需要有关JQuery UI自动完成功能的帮助。我希望我的文本字段（.suggest-user）显示来自AJAX请求的名称。这就是我所拥有的：

jQuery("input.suggest-user").autocomplete({
    source : function(request, response) {
        var name = jQuery("input.suggest-user").val();
        jQuery.get("usernames.action?query=" + name, function(data) {
            console.log(data);  // Ok, I get the data. Data looks like that:
            test = data;        // ["[e-mail]", "[e-mail]","[e-mail]"]
            return test;        // But what now? How do I display my data?
        });
    },
    minLength : 3
});

很感谢任何形式的帮助。

Answer 1

在您的AJAX回调内部，您需要调用该response函数；传递包含要显示项目的数组。

jQuery("input.suggest-user").autocomplete({
    source: function (request, response) {
        jQuery.get("usernames.action", {
            query: request.term
        }, function (data) {
            // assuming data is a JavaScript array such as
            // ["[e-mail]", "[e-mail]","[e-mail]"]
            // and not a string
            response(data);
        });
    },
    minLength: 3
});

如果响应JSON与jQueryUI自动完成功能接受的格式不匹配，则必须在将结果传递给响应回调之前在AJAX回调内部转换结果。