入力ボックスにライブ検索を実装しようとしています

Question

私はテキストボックスにライブ検索を実装しようとしていますが、サーバーからのオプションのリストは使用できない場合は動的に追加する必要があります。 」と、それをリストに追加すべきか、それがリストのトップに

Codeply示さなければならないことを選択：アイテムのコードで指定し、要素 『entranceExamSearch』は、入力ボックスのcontailsリストとして https://www.codeply.com/go/d6WaXok32m

を

Answer 1

このコードはあなたにいくつかのアイデアを提供します。

HTML：

<input type="text" id="searchPro" /> 
Your all the dynamic result will be show inside the div 
<div id="searchLog"></div> 

はJQuery：

$("#searchPro").autocomplete({ 
    source: function(request,response) { 
     $.ajax({ 
      url: "php.func.php", 
      type: "POST", 
      data: { term: request.term }, 
      success: function (searchData) { 
       $('#searchLog').html(searchData); 
      } 
     }) 
    } 
}); 

PHP：[jQueryのA：php.func.php

$find = "SELECT * 
     FROM tbl_products 
     WHERE (`product_name` LIKE '%".$_REQUEST['term']."%')"; 

$resset = $conn->query($find); 
    while ($res = mysqli_fetch_object($resset)) { 
    $findRes[] = $res; 
} 
if (!empty($findRes)) { 
    foreach ($findRes as $ResultSet) { 
     echo "<tr><td>".$ResultSet->product_name."</td>"; 
    } 
}else{ 
    echo "<p>No Result Found for keyword <b>".$_REQUEST['term']."</b>..<p><hr/>"; 
} 

はこちらのリンクですutocomplete] [1]

これは私のプロジェクトで使用しているあなたの基本的な参照コードです。あなたのニーズに応じて変更することができます。これがあなたを助けることを願っています。 詳細についてはhttps://jqueryui.com/autocomplete/