Question

我一直在努力让jQuery UI自动完成工作使用远程源。我得到了每个请求的正确结果（使用Chromes Inspector），但由于某种原因没有显示下拉框。这是搜索字段：

<form action={'/content/search'|ezurl} class="search-form">
    <fieldset>
        <input type="text" id="Search" name="Search" class="text" />
        <input type="submit" name="SearchButton" class="submit" value="search" />
    </fieldset>
</form>

和javascript：

$(function() {

$("#Search").autocomplete({
        source: function( request, response ) {
            $.ajax({
                url: "/content/search",
                dataType: "get",
                data: {
                    maxRows: 12,
                    query: request.term,
                    filter: 'author'
                }
            });
        },
        type:"json",
        select: function(event, ui) 
        {
            window.location =  ui.item.url;
        }
   });
});

返回：

[{"html":"<li><a href=\/Author\/Per_Asmund\/(language)\/nor-NO>Asmund, Per<\/a><\/li>","url":"\/Forfattere\/Per_Asmund\/(language)\/nor-NO","id":"210"},
{"html":"<li><a href=\/Forfattere\/Per_AErlend\/(language)\/nor-NO>Erlend, Per<\/a><\/li>","url":"\/Forfattere\/Per_AErlend\/(language)\/nor-NO","id":"238"}]

我可能只是错过了一些东西，但我不能为我的生活弄清楚。非常感谢任何帮助！

Answer 1

您错过了response param

中的source来电

      $.ajax({
            url: "/content/search",
            dataType: "JSON", // edit: fixed ;)
            data: {
                maxRows: 12,
                query: request.term,
                filter: 'author'
            },
            success: function(data) { response(data); } // add this line
        });

但在这种情况下，也许有些more simple usage会更好。

jQuery UI自动完成：未显示下拉列表

1 个答案: