我想在表的state列中添加一个搜索和筛选功能,最好使用jquery。
这是桌子的密码。
<div id="container">
<div class="table-responsive">
<p>
Search: <input type="text" id="table-filter" value="">
</p>
<table id ="table" class="table table-striped">
<thead>
<tr>
<th> First Name </th>
<th> Last Name </th>
<th> State </th>
<th> Date of Birth</th>
<th> Action </th>
</tr>
</thead>
<?php
if (count($report) === 0) {
echo "<tr>No Reports</tr>";
} else {
for ($i = 0; $i < count($report); $i++) {
echo
"<tr>
<td>{$report[$i]['First_Name']}</td>
<td>{$report[$i]['Last_Name']}</td>
<td>{$report[$i]['State']}</td>
<td>{$report[$i]['Date_of_Birth']}</td>
<td><a class=btn href='read.php?id=".$read['Id']."'>Read</a></td>
</tr>";
}
}
?>
</table>
</div>
</div>
主.js
$(document).ready(function(){
$("#table-filter").on("keyup", function() {
var value = $(this).val().toLowerCase();
$("#table").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
});
});
});
我对jquery很陌生。任何帮助都将不胜感激。