Question

我正在尝试设置自动填充字段。

我读过JQuery UI文档，但是所有的例子都假设源是一个静态的项目列表，JQuery将从中选择匹配的条目（我的意思是静态=列表是完整的，不依赖于用户的内容键入）。

以下是“远程数据源”示例中的代码：

$( "#birds" ).autocomplete({
    source: "search.php",
    ...

我希望JQuery调用search.php?query=mytext（此URL返回匹配项的列表），因为我需要使用PHP在数据库中查找建议。

有办法吗？也许我不明白文档？

Answer 1

来自自动完成的jQuery UI文档：

只需指定源选项，即可自定义自动完成功能以使用各种数据源。数据源可以是：


包含本地数据的数组

一个String，指定一个URL

a Callback

并进一步向下

使用String时，Autocomplete插件希望该字符串指向将返回JSON数据的URL资源。它可以位于同一主机上，也可以位于不同的主机上（必须提供JSONP）。请求参数“ term ”会添加到该网址中。数据本身的格式与上述本地数据的格式相同。

你试过你给的代码吗？它应该调用网址 search.php？term = mytext

Answer 2

以下是我在一段时间后写的一些客户端代码的片段（改为保护无辜！），这完全符合您的要求......

    function ConfigureAutoComplete() {

        $('#myautocomplete').autocomplete({
            type: "POST",
            minLength: 3,
            source : function (request, response) 
            {                         
                var source_url = "../handlers/MyLookup.ashx?someparameter=" + $("#someparameter").val();

                $.ajax({
                    url: source_url,
                    dataType: "json",
                    data: request,
                    success: function (data) { response(data); },
                    error : function (a,b,c) { HandleLookUpError(a); }
                    });
            },                
            select: function (event, ui) { $('#result').val(ui.item.id); }               
        });
    }

正如已经说过的那样，您的search.php页面可以返回您想要的任何内容。因此，您可以缩小服务器上的列表并将其返回给客户端，然后允许用户从该列表中进行选择。

Answer 3

那么search.php可以返回它想要的任何东西。

对于静态内容，您可能希望执行以下操作：

$myList = array('pizza'=>array('mushrooms','pepperoni','olives'));
echo json_encode($myList);

这与数据库调用给你的距离不远。

php中的许多框架在从数据库中查找后返回一个关联数组。我相信（我记得）即使是内置于php的标准mysql工具也会做同样的事情（或者类似的东西）。

json_encode / json_decode可以帮助将你想要的任何内容转换成json。然后你需要做的就是回应它，自动完成将相应地做出响应。

你正确地做到了。您可能只需要稍微改变格式。你目前从search.php输出什么？

哦，我差点忘了你可能需要指明你的输出是jsonp（虽然有时你可以逃避不这样做）：

header('content-type: application/json; charset=utf-8');

JQuery自动完成服务器端匹配

3 个答案: