jQuery UI 自动完成 - 未找到结果

Question

我有以下

<form action="" method="post">
  <input type="text" class="auto" name="search" autocomplete="off">
</form>

<script>
  $(document).ready(function($){
    $('.auto').autocomplete({
     source:'connect.php',
     minLength:1
    });
  });
</script>

还有connect.php 我知道我必须在将 $term 输入到我的查询之前对其进行清理。

if(isset($_GET['term'])) {
  require "db.php";

  $con = mysqli_connect("$host","$user","$password","$db");

  if (mysqli_connect_errno())
    {
    echo "Failed to connect to MySQL: " . mysqli_connect_error();
    }

  $term = $_GET['term'];
  $query = "SELECT `name` FROM `products` WHERE `name` LIKE '%$term%'";
  $result = mysqli_query($con, $query);

  while ($row = mysqli_fetch_array($result)) {
    echo json_encode($row);
  }
}

如果我在输入字段中输入 M 并使用 chrome 工具检查响应，我会得到这个。

{"0":"MacBook Pro 13 英寸","name":"MacBook Pro 13 英寸"}{"0":"MacBook Pro 15 英寸","名称":"MacBook Pro 15 英寸"}{"0":"MacBook Air 13 英寸","名称":"MacBook Air 13 英寸"}{"0":"MacBook Air 11 英寸","名称":"MacBook Air 11 英寸"}{"0":"iMac 21.5 英寸","名称":"iMac 21.5 英寸"}{"0":"iMac 27 英寸","名称":"iMac 27 英寸"}{"0":"Mac Pro 四核","name":"Mac Pro 四核"}{"0":"Mac Pro 6-Core","name":"Mac Pro 6-Core"}

但是，由于某种原因，它在页面上显示“未找到结果”，即使有？

Answer 1

您的 php 脚本创建的输出不是有效的 json - 您必须将各个对象包装在一个数组中：

[{"0":"MacBook Pro 13-inch","name":"MacBook Pro 13-inch"}, {"0":"MacBook Pro 15-inch","name":"MacBook Pro 15-inch"}, {"0":"MacBook Air 13-inch","name":"MacBook Air 13-inch"}, {"0":"MacBook Air 11-inch","name":"MacBook Air 11-inch"}, {"0":"iMac 21.5-inch","name":"iMac 21.5-inch"}, {"0":"iMac 27-inch","name":"iMac 27-inch"}, {"0":"Mac Pro Quad-Core","name":"Mac Pro Quad-Core"}, {"0":"Mac Pro 6-Core","name":"Mac Pro 6-Core"}]

像这样修改你的 PHP 脚本：

$result = array();
while ($row = mysqli_fetch_array($result)) {
    $result[] = $row;
  }

json_encode($result);

除此之外 - 您的输出应该具有属性 id、值和标签，而不仅仅是“0”。