Панель поиска по автозаполнению jquery ui с использованием PHP и MYSQL - PullRequest
Новая
       20

Панель поиска по автозаполнению jquery ui с использованием PHP и MYSQL

0 голосов
/ 29 апреля 2019

Я хочу добавить панель поиска на своем веб-сайте, поэтому я добавил функцию автозаполнения поиска jQUery UI, и она работает как чудо, и результаты отображаются в базе данных.Но мне нужно, если пользователь нажимает на результат из списка, который я хочу, чтобы перенаправить пользователя на эту страницу продукта.Это код в navigation.php: 

<div id="search-div">
  <form action="#" id="form-search" method="POST" class="form-inline">
    <input id="language" type="text" placeholder="Search for a product" style="padding-left:15px;">
    </form>
</div>

<script>
$("#language").autocomplete({
  appendTo: $("#language").parent(),
  source: function(data, cb){
    $.ajax({
      url: '/tutorial/admin/parsers/ajax.php',
      method: 'GET',
      dataType: 'json',
      data: {
        title: data.term
      },
      success: function(res){
      cb(res);
      }
    });
  }
});
</script>

А это код ajax.php: 

<?php
require_once $_SERVER['DOCUMENT_ROOT'].'/tutorial/core/init.php';
$data = array();
if (!empty($_GET['title'])) {
  $title = strtolower(trim($_GET['title']));
  $sql = "SELECT title FROM products WHERE title LIKE '" .$title. "%'";
  $result = $db->query($sql);
  while ($row = mysqli_fetch_assoc($result)) {
    array_push($data, $row['title']);
  }
}
echo json_encode($data);
exit;
 ?>

Страница, на которую я хочу перенаправить пользователя, - products.php? details = 20 , где 20 - идентификатор продукта, это страница метода GET.Как сделать возможность перенаправить страницу товара по идентификатору, если пользователь нажимает на этот товар из списка поиска?

Ответы [ 3 ]

0 голосов
/ 29 апреля 2019

Я не уверен, как это сделать в jquery ui с автозаполнением. Старая ссылка может быть полезна.Но это легко, если вы можете использовать Twitter Typeahead вместо JQ UI.

0 голосов
/ 29 апреля 2019 
select: function(event, ui) {
   doSearch(ui.item.title);
}

function doSearch(term) {
    window.location.href = 'Search.php?q=' + term;
}

search.php является вашим контроллером или содержит файл бизнес-логики. Вы можете передать параметр запроса по своему усмотрению.

0 голосов
/ 29 апреля 2019

Попробуйте это: 

  $(document).ready(function() {
    $("#language").autocomplete({
        source: function(data, cb){
    $.ajax({
      url: '/tutorial/admin/parsers/ajax.php',
      method: 'GET',
      dataType: 'json',
      data: {
        title: data.term
      },
      success: function(res){
      cb(res);
      },
        select: function( event, ui ) {
            window.location.href = ui.item.link;
        }
    });
});
...