jquery ui 自动完成数据库答案

【问题标题】：jquery ui autocomplete databasejquery ui 自动完成数据库
【发布时间】：2011-02-21 20:25:06
【问题描述】：

我想使用 jQuery UI 自动完成功能从我的数据库中加载列表，但我不知道应该使用哪种方法。

我尝试使用“远程数据源”方法http://jqueryui.com/demos/autocomplete/#remote，但显然不起作用。

我有以下代码：

js:

$(function() {
    $("#client").autocomplete({
    source: "nom.php",
    minLength: 2,
        select: function(event, ui) {
        alert(ui);
        }
    });
});

html：

<label for="client">Client</label>
<input name="client" id="client" class="ui-autocomplete ui-widget-content ui-corner-all" />

php:

$query = "SELECT nom from personne";
$result = mysql_query($query, $db);

while($row = mysql_fetch_assoc($result)) {

foreach($row as $val)
    $tab[] = $val;

}

print json_encode($tab);

无论我输入什么，它都会显示所有值，但是当我复制 nom.php 的结果并将其粘贴到源代码旁边时：它确实有效...

谢谢你的掌舵

【问题讨论】：

这应该可以。你必须检查你的日志，也许用像firebug这样的工具做一些非常简单的javascript调试（只是为了检查函数是否被很好地调用，并且'nom.php'被调用并返回良好的数据）。
我实际上不明白这个自动完成是如何工作的：当我使用 firefox 进行调试时，我看到响应是 ["Marion","AM","PE","AH","JP" ,"FD"] 无论我写什么，我都希望自动完成功能从这个列表中选择好的值，但事实并非如此。当我写 source: ["Marion","AM","PE","AH","JP","FD"] 时，它确实工作正常。
我找到了某种解决方法，但我更愿意了解我的代码有什么问题。这是解决方法： $query = "SELECT nom from employee WHERE nom LIKE '%" 。添加斜杠（$_GET['term']）。 "%'";
是的，您需要使用 where 子句过滤项目...绝对...
您可能还想只选择有限数量的结果，例如前 10/20 名，也可以订购它们

标签： database json jquery-ui autocomplete

【解决方案1】：

问题是您没有过滤结果服务器端。

当您使用本地集合时，本地集合会通过自动完成功能自动过滤。

但是，当使用远程源时，源应该进行过滤。我想这是为了节省带宽，以便服务器只发送匹配的项目，而不是所有项目，然后让浏览器过滤。

在调用服务器端方法时，自动完成功能还会发送一个名为 term 的参数，您可以使用该参数进行过滤。

您可以在 php 脚本中像这样获取输入的值：

 $term = trim(strip_tags($_GET['term']));

然后在您的foreach 中，仅将匹配过滤器的项目添加到您的收藏中，然后再将其发回。

【讨论】：