如何从数据库自动完成引导 php mysql ajax答案

【问题标题】：how to autocomplete bootstrap php mysql ajax from database如何从数据库自动完成引导 php mysql ajax
【发布时间】：2019-09-23 03:16:33
【问题描述】：

自动完成功能不工作我想从 mysql 数据库中获取数据，例如 google 选项我的文件不工作当我们按下从 sugested 选项中选择数据时没有显示任何内容

请推荐一些好的代码我的代码没有运行 现在不工作了，先生 并且自动选择没有显示类似的答案 this is link where showing but not selecting any data under key selection this is link where show nothing

     <!DOCTYPE html>
    <html>
    <head>
    <title></title>
    <!--my file not working auto complete address from database-->
    <!--code inclide file of botstarp -->
<script        
   src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.min.js"></script>  
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
        <!--code of auto fetch-->
      <script>
     $(document).ready(function () {
       $('#Country').typeahead({
        source: function (query, result) {
            $.ajax({
                url:"autoselect_jquery5.php",
                data:'query=' + query,            
                dataType:"json",
                type:"POST",
                success: function (data) {
                    result($.map(data, function (item) {
                        return item;
                    }));
                }
            });
           }
        });
     });
      </script>
       </head>


       <body>
       div class="container" style="width:600px;">
      <h2 align="center">Autocomplete Textbox using Bootstrap Typeahead with Ajax PHP</h2>

                 <label>Search Country</label>
       <input type="text"name="country"id="country"autocomplete="off"placeholder="Country" />
     </div>
 </body>
   <   /html> 

       <!--second file which fetching data from from database -->
     // autoselect_jquery5.php file for fetch code
       <?php
     include 'database.php';

     if (isset($_POST['query'])) {
     $search_query = $_POST['query'];


      $query = "SELECT * FROM transporter WHERE address LIKE 
  '%".$search_query."%' LIMIT 12";
   $result = mysqli_query($link, $query);
  $data = array();

    if(mysqli_num_rows($result) > 0)
   {
    while($row = mysqli_fetch_assoc($result))
     {
        $data[] = $row["address"];
     }
      echo json_encode($data);
          }
      }
       ?>




    }

【问题讨论】：

为什么要比较 bootstrap 和 jquery？两者是完全不同的东西。
谢谢先生，请建议我如何运行代码它不起作用

标签： php mysql autocomplete

【解决方案1】：

对于自动完成，您可以将 typehead.js 与下面的引导检查一起使用。

How do we set remote in Typeahead.js?

【讨论】：

【解决方案2】：

你有一些错误，我在你的代码中的 cmets 解释你。

希望能帮到你。我复制了你的代码并修复了它。

它现在正在工作。试试看并评论我。

步骤：

1) 导入数据库文件（在您的本地服务器上）。

链接数据库：https://drive.google.com/drive/u/1/folders/1JhXXPQ4QHsHssTbpdnhL_cBOrnK7Q3nB

2) 将文件 autocomplete.html 复制到本地服务器的文件夹中。

   <!DOCTYPE html>
    <html>
    <head>
    <title></title>
    <!--my file not working auto complete address from database-->
    <!--code inclide file of botstarp -->
<script        
   src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.min.js"></script>  
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
        <!--code of auto fetch-->
      <script>
     $(document).ready(function () {
       $('#country').typeahead({ // Your #Country ID is different that you using in input 
        // #Country <> 
        source: function (query, result) {
            $.ajax({
                url:"database.php",
                data:'query=' + query,            
                dataType:"json",
                type:"POST",
                success: function (data) {
                    result($.map(data, function (item) {
                        return item;
                    }));
                }
            });
           }
        });
     });
      </script>
       </head>


       <body>
       <div class="container" style="width:600px;">
      <h2 align="center">Autocomplete Textbox using Bootstrap Typeahead with Ajax PHP</h2>

                 <label>Search Country</label>
       <input type="text"name="country"id="country"autocomplete="off"placeholder="Country" />
     </div>
 </body>
</html>

3) 将 php 代码复制到同一文件夹中。

<?php		
	
	$host = 'localhost'; //This is your host, if you working locally your host will be localhost
	$user = 'root'; //The name of the your user in localhost server
	$pass = 'root'; //The password of the your user in localhost server
	$db_name = 'countries'; //The name of the database that you using

	$keyword = strval($_POST['query']); // 
	$search_param = "{$keyword}%";
	$conn =new mysqli($host, $user, $pass, $db_name);

	$sql = $conn->prepare("SELECT * FROM country WHERE name LIKE ?");
	$sql->bind_param("s",$search_param);			
	$sql->execute();
	$result = $sql->get_result();
	if ($result->num_rows > 0) {
		while($row = $result->fetch_assoc()) {
		$countryResult[] = $row["name"];
		}
		echo json_encode($countryResult);
	}
	$conn->close();
?>

4) 结束了。

【讨论】：