我的 jQuery 自动完成功能不起作用答案

【问题标题】：My jQuery autocomplete is not working我的 jQuery 自动完成功能不起作用
【发布时间】：2014-05-28 23:07:04
【问题描述】：

我正在尝试使用 jQuery 自动完成来显示我的新闻标题，同时我在搜索表单上写字。

但是我遇到了一个问题，当我在搜索输入中写入时，什么都没有出现。

我有我的 header.php 文件，我有这个脚本来启动 jQuery 自动完成：

$(function(){
  $('.j_autocomplete').autocomplete({
    source: "search.php",   
  });
});

我的 header.php 中还有一个带有搜索表单的菜单：

<nav id="menu">
  <ul>  
       <li><a href="">Home</a></li>
       .....
       <li>
         <form id="search">
            <input name="search" class="j_autocomplete" type="text"  placeholder="Search..." />
            <button type="submit">Search</button>
         </form>
      </li>
  </ul>

然后我有我的来源，即我的 search.php 文件，我在其中选择我的新闻标题以显示在我的 jQuery 自动完成上：

<?php

$search= $_GET['term'];
$readNews = $pdo->prepare("SELECT * from news WHERE title LIKE ? ORDER BY title ASC");   
$readNews->bindValue(1, "%$search%", PDO::PARAM_STR);
$readNews->execute(); 

$resJson = '[';
$first = true;

while($res = $readNews->fetch(PDO::FETCH_ASSOC))
{
  if(!$first)
  {
    $resJson .= ', ';
  }
  else
  {
    $first = false;
  }
    $resJson .= json_encode($res['title']);
  }

$resJson .= ']';

echo $resJson;

?>

对我来说一切都很好，如果在我的 search.php 文件中我只在下面放了这段代码，当我开始在我的自动完成中写入时，我会得到所有这 4 个名称，所以看来我的来源也是正确的：

<?php
$result = array("Henry","Tom","Terry","Chris");
echo json_encode($result);
?>

您知道我的错误可能在哪里吗？

在自动完成文档中说“术语”是要使用的查询字符串键，但是我怀疑这是关于我的$_GET['term'] 无法正常工作的问题，但我已经用$_REQUEST['term'] 进行了测试并且也无法正常工作！

【问题讨论】：

$pdo 来自哪里？ $readNews->execute(); 执行成功了吗？您的控制台中是否出现任何错误？
是的执行，如果我访问我的 localhost/project/search.php ，我得到这个：注意：未定义的索引：术语，我得到我的表新闻的所有 5 个标题：“[\”标题1\\u00f3\"，\"标题 2\\u00e9\"，\"标题 3\"，\"标题 4\"，\"标题 5\"]"
你用什么浏览器？
我正在使用谷歌浏览器！
var_dump 在我的 search.php 文件中给出：array(1) { ["url"]=> string(6) "search" } array(0) { }

标签： php jquery jquery-plugins autocomplete

【解决方案1】：

编辑： 经过数小时的调试和结构更改，我们终于让它工作了。

问题是 .htaccess 重写和之前代码中的一些小错误的混合。

我不确定如何描述我们为使其发挥作用所做的一切。

尝试构建更健壮的 json 字符串。

$data = array();

while($res = $readNews>fetch(PDO::FETCH_ASSOC))
{
  $data[] = $res['title'];
}

echo json_encode($data);

编辑：要检查未定义的索引，键入

$search = isset($_GET['term']) ? $_GET['term'] : "";

【讨论】：

感谢您的回答 BratAnon，现在我没有未定义的索引错误，但我的自动完成功能仍然无法正常工作！
来自 jqueryUi 的 API 文档。 > 源字符串：使用字符串时，自动完成插件期望该字符串指向将返回 JSON 数据的 URL 资源。尝试输入一个完整的 uri source: "http://localhost/project/search.php" 而不仅仅是 source: "search.php"。
Thaks BratAnon，我用完整路径更新了源代码，但仍然无法正常工作！！
如果它适用于硬编码数据，那么（就像你说的）它不是 HTML 或 javascript 的问题。我敢打赌，db 查询有问题。查询本身似乎很好。我不知道这是不是错字，但是while($res = $readNews>fetch(PDO::FETCH_ASSOC)) 呢，不应该是while($res = $readNews->fetch(PDO::FETCH_ASSOC))。注意“-”。
感谢您的帮助并注意到，我用正确的方式更新了我的问题。但在我这里的例子中，我的理解是正确的，当我在这里翻译时，我无意中删除了它！

【解决方案2】：

我很同情你的困境 - 大约一年前我也陷入了同样的困境，然后我在 SO 上得到了一些很大的帮助。

我所有的自动完成错误都是因为我没有向自动完成功能提供真正的 json 文件。所以我了解到，对于您编写的每个 PHP 文件，将其作为独立文件运行，获取屏幕输出，并使用 jsonlint 对其进行测试。

我学到的第二件事是，如果你先用你的 php 调用整个文件，然后将它呈现给自动完成功能，它可能会更容易（如果你没有太多的变量要读取）。一旦我从这两个步骤开始，从那以后我就没有出现过重大故障。希望对你有帮助。

$(function(){ 
             $.ajax ({
                      url: "../php/insurancesinglevarjson.php",
                 dataType: "json"
                      })
                        .done(function (data) {
                                               console.dir(data);
                                               var source = data;
                                               $("#companyname").autocomplete({
                                                                               source: source});
                                                                               });
                       });

【讨论】：