Question

我有一个自动完成搜索字段，当用户输入名称时，结果显示在下拉列表中。

这一切都运行正常，并按原样显示数据。

我等待将每个结果都设为链接，因此当显示结果时，用户可以点击正确的名称，然后将其带到他们的个人资料中。

见下面的脚本：

<input type='text' id=employees class='form-control' size="80" placeholder="Search Employees by first or last name">

的search.php

$searchTerm = $_GET['term'];

    $sql = mysql_query ("SELECT name_first, employee_id, unique_id, name_last FROM hr_employees WHERE name_first LIKE '{$searchTerm}%' OR name_first LIKE '{$searchTerm}%' OR employee_id LIKE '{$searchTerm}%'");
    $array = array();
    while ($row = mysql_fetch_array($sql)) {
        $array[] = array (

            'value' => $row['name_first'].' '.$row['name_last'].' ('.$row['employee_id'].')',

        );
    }
    //RETURN JSON ARRAY
    echo json_encode ($array);

选择正确的用户后，我希望用户指向page.php？id = $ employee_id

这可能吗？

的JavaScript

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

的JavaScript

<script>
$(function() {
$( "#employees" ).autocomplete({
source: 'search.php'
});
});
</script>

Answer 1

根据要求：

PHP：

$pdo        = new \PDO('mysql:host=localhost;dbname=test', $user, $pass);
$searchTerm = $_GET['term'];

$stmt = $pdo->prepare("SELECT name_first, employee_id, unique_id, name_last FROM hr_employees WHERE name_first LIKE :search OR name_first LIKE :search OR employee_id LIKE :search");
$stmt->execute([':search' => $searchTerm.'%']);

$array = [];
while (false !== ($row = $stmt->fetch())) {
    $array[] = [
        'value' => $row['name_first'].' '.$row['name_last'].' ('.$row['employee_id'].')',
        'id'    => $row['id'],
    ];
}

echo json_encode($array);

JavaScript的：

<script>
    $( "#employees" ).autocomplete({
        source: 'search.php',
        select: function( event, ui ) {
          window.location.href = 'page.php?id='+ui.item.id;
        }
    });
</script>

使用console.log而不是位置更改：https://jsfiddle.net/dLe4a83x/

Answer 2

Dev尝试使用此代码Autocomplete Search Box In Php Mysql

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Autocomplete Search Box in PHP MySQL - Php Coding Stuff</title>
 
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" />
 
  <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
  <!-- Bootstrap Css -->
  <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body> 
<div class="container">
  <div class="row">
     <h2>Search Here</h2>
     <input type="text" name="search" id="search" placeholder="search here...." class="form-control">  
  </div>
</div>
<script type="text/javascript">
  $(function() {
     $( "#search" ).autocomplete({
       source: 'ajax-db-search.php',
     });
  });
</script>
</body>
</html>

用于搜索的PHP脚本

<?php
require_once "db.php";
if (isset($_GET['term'])) {
     
   $query = "SELECT * FROM users WHERE name LIKE '{$_GET['term']}%' LIMIT 25";
    $result = mysqli_query($conn, $query);
 
    if (mysqli_num_rows($result) > 0) {
     while ($user = mysqli_fetch_array($result)) {
      $res[] = $user['name'];
     }
    } else {
      $res = array();
    }
    //return json res
    echo json_encode($res);
}
?>

了解更多：https://www.phpcodingstuff.com/blog/autocomplete-search-box-in-php-mysql.html

Answer 3

在这里，您可以使用JQuery UI库在自动完成搜索中进行导航，在PHP和Mysql中进行自动完成搜索。这是工作代码：

HTML表单：

<form>
    <input id="dd_user_input" class="search_form" type="text" value="Type your Input Here"/>
</form>

JavaScript代码：

$(function() {

  $("#dd_user_input").autocomplete({
    source: "global_search.php?cityId=28",
    minLength: 2,
    select: function(event, ui) {
      var getUrl = ui.item.id;
      if (getUrl != '#') {
        location.href = getUrl;
      }
    },

    html: true,

    open: function(event, ui) {
      $(".ui-autocomplete").css("z-index", 1000);
    }
  });

});

此处提到了位置href，因此用户可以在单击此链接时进行导航。在这里，您可以通过查询填充的JqueryUI获取getUrl的数据。作为参考，您可以检查：https://www.discussdesk.com/autocomplete-search-in-php-mysql-json-with-navigation.htm

PHP MySQL自动完成

3 个答案: