jquery-autocomplete with json array


jquery-autocomplete with json array

我想知道我如何才能让它工作?我已经阅读了演示文件,但我很好奇是否有办法让它像这样工作。我有一个像这样的 php 文件

$query = "SELECT DISTINCT City FROM Locations ORDER BY City";
foreach($DBH->query($query) as $row)
{
    $array[] = $row['City'];
}
echo json_encode($array);

和一些 js

$('.searchbox').autocomplete('test.php', {minChars: 3,});

当我测试它时,我输入三个字母,而不是建议,我得到整个 json 数组。我知道这个jquery自动完成可以处理本地数据,但我只是不知道怎么做。顺便说一下,https://github.com/dyve/jquery-autocomplete/是来源。

当您提供网址"test.php"作为自动完成的来源时,您的网页必须计算由提供的"term"请求参数完成的名称。

从文档:

使用字符串时,自动完成插件期望该字符串 指向将返回 JSON 数据的 URL 资源。它可以在 同一主机或不同主机(必须提供 JSONP)。自动完成 插件不过滤结果,而是过滤请求参数 "term"被添加到 URL 中,服务器端脚本应使用该 URL 用于过滤结果。数据本身可以采用相同的格式 作为上述本地数据。

这意味着您必须在 SQL 查询中使用 term 请求参数来筛选结果,例如

$query = "SELECT DISTINCT City FROM Locations where City like '".$term."%' ORDER BY City";

文档说,如果您的后端返回 JSON 数组,您应该设置一个值为 jsonremoteDataType选项:

远程数据类型(默认值:假)

如果将其设置为"json",则自动完成程序需要来自服务器的 JSON 数组。任何其他 设置,它默认为使用行分隔符和单元格分隔符的本机文本格式(见下文)。

例如

$('.searchbox').autocomplete('test.php', {
  minChars: 3,
  remoteDataType: 'json'
});

此外,服务器端查询应使用自动完成程序在GET中发送的 q 参数,以仅返回与键入的内容匹配的结果。

将输入文本作为 GET 变量发送到测试.php文件,并使用该变量将过滤器应用于查询。