如何在 JQuery UI 自动完成中使用 source: function()... 和 AJAX

问题描述

我需要 JQuery UI 自动完成方面的一些帮助.我希望我的文本字段 (.suggest-user) 显示来自 AJAX 请求的名称.这就是我所拥有的:

I need a little bit help with JQuery UI Autocomplete. I want my textfield (.suggest-user) display names from an AJAX request. This is what I have:

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
});

非常感谢任何帮助.

推荐答案

在你的 AJAX 回调中，你需要调用 response 函数；传递包含要显示的项目的数组.

Inside your AJAX callback you need to call the response function; passing the array that contains items to display.

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 与 jQuery UI 自动完成接受的格式不匹配，那么您必须在将结果传递给响应回调之前在 AJAX 回调中转换结果.查看此问题和已接受的答案.

If the response JSON does not match the formats accepted by jQuery UI autocomplete then you must transform the result inside the AJAX callback before passing it to the response callback. See this question and the accepted answer.

这篇关于如何在 JQuery UI 自动完成中使用 source: function()... 和 AJAX的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！