PHP Ajax 实时搜索只返回一个结果

Question

我正在尝试创建一个简单的实时搜索，我可以在其中输入城市名称，它会返回所有相关城市。

这是我的代码。除了一件事，它有效。它只在输入时返回一个城市。如果输入词与它们部分匹配，它不应该返回多个城市吗？你能告诉我我做错了什么吗？

// HTML

<form action="" method="POST">
 <input type="text" id="city-box" class="type-input" name="sel-city" autocomplete="off" value="<?php if(!empty($post_city)) { echo $post_city; }?>" placeholder="Type City Name" />

 <input type="hidden" id="city-box-id" name="sel-city-hidden" value="<?php if(!empty($post_city_hidden)) { echo $post_city_hidden; }?>"/>

 <div id="display-cities"></div>

 <input type="submit" name="search" value="Search" />
</form>

// JAVASCRIPT

<script>
$(document).ready(function() {

$('#display-cities').hide();

 $("#city-box").keyup(function() {
     var name = $('#city-box').val();
     if (name == "") {
       $('#display-cities').hide();
     } else {

       $.ajax({
           type: "POST",
           url: "snippets/backend-search.php",
           dataType: 'json',
           cache: false,
           data: { term: name },
           success: function(data) {
            var citydata  = '<div class="output-results"><p class="output-p1">' + data.cityname + '</p><p class="output-p2">' + data.provincename + ', '+ data.countryname + '</p></div>';
            var citydata2 = '' + data.cityname + ', ' + data.provincename + ', ' + data.countryname + '';

            $("#display-cities").html(citydata).show();

            $( ".output-results" ).click(function() {
              $("#city-box-id").val(data.cityid);
              $("#city-box").val(citydata2);
              $("#display-cities").html(citydata).hide();
            });

           }
       });
     }
 });
});
</script>

// 后端搜索.PHP

if(isset($_POST["term"])){

 $param_term = $_POST["term"] .'%';

 $get_city_select = $db->prepare("SELECT cities.city_id, cities.city_name, 
 provinces.province_id, provinces.province_name, countries.country_id, countries.country_name 
 FROM cities
 LEFT JOIN provinces ON cities.province_id = provinces.province_id
 LEFT JOIN countries ON provinces.country_id = countries.country_id
 WHERE city_name LIKE :param");
 $get_city_select->bindParam(':param', $param_term);
 $get_city_select->execute();
 $result_city_select = $get_city_select->fetchAll(PDO::FETCH_ASSOC);
 if(count($result_city_select) > 0) {
  foreach($result_city_select as $row) {
   $s_city_id      = $row['city_id'];
   $s_city_name    = $row['city_name'];

   $s_province_id  = $row['province_id'];
   $s_province_name  = $row['province_name'];

   $s_country_id     = $row['country_id'];
   $s_country_name  = $row['country_name'];

   echo json_encode (array("cityid" => "{$s_city_id}", "cityname" => "{$s_city_name}", 
   "provincename" => "{$s_province_name}", "countryname" => "{$s_country_name}"));
  }
 }
}

Answer 1

每次输出城市结果时，您都会调用json_encode。这将产生多个 JSON 位。相反，将所有结果放入一个数组并使用json_encode 对其进行编码。

编辑：

你现在已经完成了：

$arr[] = array (
  "cityid"        => "{$s_city_id}",
  "cityname"      => "{$s_city_name}",
  "provincename"  => "{$s_province_name}",
  "countryname"   => "{$s_country_name}"
);

在这里，您正在为每个城市结果构建一个新数组。而是这样做：

$cities = [];
foreach($result_city_select as $row) {
  $city = new \stdClass();
  $city->id = $row['city_id'];
   // ...more city properties...
  array_push($cities, $city);
}
echo json_encode($cities);

对于每个城市，都会创建一个新的匿名 PHP 对象 (stdClass)，并用城市信息填充其属性。然后将此对象实例添加到cities 数组中，最终以 JSON 格式发送到标准输出。

每个城市都必须是 JSON 对象，而不是数组。