フィルタをmySQLクエリの結果をテーブルjQueryを使用してですか？

私はMySQLのクエリから私の結果をフィードバックするために私のテーブルを設定することができました。私は各キーを押すとトリガする検索フィールドを使用して結果をフィルタリングできるようにしていますが、データを表示するために使用しているメソッドを操作するサンプルは見つかりません。フィルタをmySQLクエリの結果をテーブルjQueryを使用してですか？

任意のアイデア

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
<title>ProSys Component Lookup</title> 
</head> 

<body> 

<div class="container"> 
<div class="col-md-12"> 
    <div class="col-md-12"> 
    <div class="page-header"> 
     <h1>ProSys Component Lookup</h1> 
    </div> 
    <div class="col-md-6 search"> 
     <form class="styled"> 
     <fieldset> 
      <input type="text" placeholder="Search.."> 
     </form> 
    </div> 
    <div class="col-md-6"> 

    </div> 
    <div class="panel"> 
     <div class="panel-body"> 
     <div class="row"> 
      <div class="col-md-12"> 
      <table class="table table-striped" id="myTable"> 
      <thead> 
       <tr> 
       <th>Location</th> 
       <th>Manufacturer</th> 
       <th>Description</th> 
       <th>PackageSize</th> 
       <th>Supplier</th> 
       <th>SupplierNumber</th> 
       </tr> 
      </thead> 
       <tbody> 
       <tr> 
       <?php 
       include("DBConfig.php"); 

       $result = mysql_query("SELECT DrawLocation, Manufacturer, Description, PackageSize, Supplier, SupplierNumber FROM complibrary"); 

       while($complibrary = mysql_fetch_array($result)) 
       { 
        echo"<td>".$complibrary['DrawLocation']."</td>"; 
        echo"<td>".$complibrary['Manufacturer']."</td>"; 
        echo"<td>".$complibrary['Description']."</td>"; 
        echo"<td>".$complibrary['PackageSize']."</td>"; 
        echo"<td>".$complibrary['Supplier']."</td>"; 
        echo"<td>".$complibrary['SupplierNumber']; 
        echo "</tr>"; 
       } 
       mysql_close($conn); 
       ?> 
      </table> 
      </div> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 
</body> 
</html>

、以下の私のコードを参照してください？私は基本的に、私のクエリから返されたタグをフィルタリングする方法を探しています。

EDIT：この作業を行う方法を見つけることができましたが、最初の列のみを検索します。入力内のパラメータoutsetを使用して、すべての列にわたってこの検索を行うことは可能ですか？

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
<!-- Latest jQuery --> 
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script> 
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 
<title>ProSys Component Lookup</title> 
</head> 

<body> 

<div class="container"> 
<div class="col-md-12"> 
    <div class="col-md-12"> 
    <div class="page-header"> 
     <h1>ProSys Component Lookup</h1> 
    </div> 
    <div class="col-md-6 search"> 
     <form class="styled"> 
     <fieldset> 
      <input type="text" onkeyup="myFunction()" id="myInput" placeholder="Search.."> 
     </form> 
    </div> 
    <div class="col-md-6"> 

    </div> 
    <div class="panel"> 
     <div class="panel-body"> 
     <div class="row"> 
      <div class="col-md-12"> 
      <table class="table table-striped"> 
      <thead> 
       <tr> 
       <th>Location</th> 
       <th>Manufacturer</th> 
       <th>Description</th> 
       <th>PackageSize</th> 
       <th>Supplier</th> 
       <th>SupplierNumber</th> 
       </tr> 
      </thead> 
       <tbody id="myTable"> 
       <tr> 
       <?php 
       include("DBConfig.php"); 

       $result = mysql_query("SELECT DrawLocation, Manufacturer, Description, PackageSize, Supplier, SupplierNumber FROM complibrary"); 

       while($complibrary = mysql_fetch_array($result)) 
       { 
        echo"<td>".$complibrary['DrawLocation']."</td>"; 
        echo"<td>".$complibrary['Manufacturer']."</td>"; 
        echo"<td>".$complibrary['Description']."</td>"; 
        echo"<td>".$complibrary['PackageSize']."</td>"; 
        echo"<td>".$complibrary['Supplier']."</td>"; 
        echo"<td>".$complibrary['SupplierNumber']."</td>"; 
        echo "</tr>"; 
       } 
       mysql_close($conn); 
       ?> 
      </table> 
      </div> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 

    <script> 
    function myFunction() { 
     var input, filter, table, tr, td, i; 
     input = document.getElementById("myInput"); 
     filter = input.value.toUpperCase(); 
     table = document.getElementById("myTable"); 
     tr = table.getElementsByTagName("tr"); 
     for (i = 0; i < tr.length; i++) { 
     td = tr[i].getElementsByTagName("td")[0]; 
     if (td) { 
      if (td.innerHTML.toUpperCase().indexOf(filter) > -1) { 
      tr[i].style.display = ""; 
      } else { 
      tr[i].style.display = "none"; 
      } 
     } 
     } 
    } 
    </script> 

</body> 
</html>

出典

2017-06-19 Tom Algar

あなたはjQuery#Autocomplete APIを見てする必要があります。ここにはいくつかの例があります。

出典

2017-06-19 13:59:03 Ravi

申し訳ありませんが、私は私の記事でよく説明していたはずです。私のクエリは、必要なフィールドのテーブルのすべてを表示しますが、このライブからフィルタすることができます。この機能に似ています：http://lookup.tachosys.com/ –

はい、それは私が指摘したのと同じ方法で動作します。それに応じて実装を行う必要があります。 – Ravi

フィルタをmySQLクエリの結果をテーブル​​jQueryを使用してですか？

答えて

関連する問題

フィルタをmySQLクエリの結果をテーブルjQueryを使用してですか？