搜索框 (AJAX) 不会加载请求的数据

Posted 2023-05-08

【中文标题】搜索框 (AJAX) 不会加载请求的数据

【英文标题】：Searchbox (AJAX) won't load requested data

【发布时间】：2021-03-22 17:13:47

【问题描述】：

所以我有一个问题，我找不到错误。

默认情况下，页面应该加载所有数据，当我点击搜索时，只有请求的数据（没有刷新页面）。

（如果我也可以通过更改 url 而无需在输入字段中输入来更改结果/请求，那就更好了：

输入 url: .../searchpage.php?search=banana --> 香蕉的结果 输入网址：.../searchpage.php?search=apple --> 苹果的结果

但要先小步。）

你有没有看到我的问题在哪里？或者你知道一些好的页面，我可以在其中找到我的问题的解决方案/信息？ \

提前非常感谢您！

index.php:

<script src="assets/js/jquery.min.js"></script>  //v3.4.1

<section class="wrapper">
   <div class="formpost">
      <div class="searchpannel">
         <input type="text" class="searchBox" name="searchBox" id="searchBox" placeholder="Search..">
         <button type="submit" id="searchBtn">SEARCH</button>
      </div>
      <div id="SearchResult"> <?php include 'startdata.php'?> </div>
   </div>
</section>
                
<script>
$(document).ready(function()
    $('#searchdata').click(function(e)
            e.preventDefault();
            var searchtext = $('input[name=searchBox]').val();
            $.ajax(
                    type: "POST",
                    url: "fetchdata.php",
                    data: 
                            "search_post_btn": 1,
                            "searchBox": searchBox,
                    ,
                    dataType: "text",
                    success: function (response) 
                            $("#SearchResult").html(response);
                    
           )
    )
)
</script>

fetchdata.php：

<?php
$conn = mysqli_connect("localhost", "root", "");
$db = mysqli_select_db($conn, 'ajax');

if(isset($_POST['search_post_btn'])) 

   $search = $_POST['searchBox'];
   $query = "SELECT * FROM ajaxtest WHERE name LIKE '%$search%' ";
   $query_run = mysqli_query($conn,$query);

   if(mysqli_num_rows($query_run) > 0)

      WHILE ($row = mysqli_fetch_assoc($query_run)) 

         echo "<h2>Hallo, my name is ";
         echo $row['name'];
         echo "<strong>";
         echo $row['famname'];
         echo "</strong></h2><p> On the list I'm place ";
         echo $row['id'];
         echo "</p>";
       
   

?>

【问题讨论】：

你必须从php函数返回数据

【参考方案1】：

您好，您必须对代码进行一些修改

 $.ajax(
                type: "POST",
                url: "fetchdata.php",
                data: 
                        "search_post_btn": 1,
                        "searchBox": searchBox,
                ,
                dataType: "json",
                success: function (response) 
                        $("#SearchResult").html(response);
                
       )

----- PHP 代码----

   <?php
  $conn = mysqli_connect("localhost", "root", "");
  $db = mysqli_select_db($conn, 'ajax');

  if(isset($_POST['search_post_btn'])) 

  $search = $_POST['searchBox'];
  $query = "SELECT * FROM ajaxtest WHERE name LIKE '%$search%' ";
  $query_run = mysqli_query($conn,$query);

  if(mysqli_num_rows($query_run) > 0)
     $design = "";
     WHILE ($row = mysqli_fetch_assoc($query_run)) 
        $design .= "<h2>Hallo, my name is ".$row['name']."<strong>".$row['famname']."</strong></h2><p> On the list I'm place ".$row['id']."</p>";
      

      print_r(json_encode($design));
      die;
  
 
 ?>

【讨论】：

谢谢，但它仍然不会将任何数据加载到结果 div 中：/

可以分享控制台数据吗，---console.log(response);

nvm，发现错误... var searchBox 之前的声明方式不同。非常感谢您的帮助！