Reputation: 7514
I'm trying to implement filtering of a table using jQuery. Here's the code I have for testing:
$("#txtGroup").keyup(function() {
var value = this.value;
$("table").find("tr").each(function(index) {
if (index === 0) return;
var id = $(this).find("td").find("label").text();
$(this).toggle(id.indexOf(value) !== -1);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="txtGroup" />
<table id="tblGroups">
<tr><td><label><input type="checkbox" id="AccountingFinance" name="Accounting & Finance">Accounting & Finance</label></td></tr>
<tr><td><label><input type="checkbox" id="AdvancedAnalytics" name="Advanced Analytics">Advanced Analytics</label></td></tr>
<tr><td><label><input type="checkbox" id="Alliances" name="Alliances">Alliances</label></td></tr>
<tr><td><label><input type="checkbox" id="BusinessAdvisoryServices" name="Business Advisory Services">Business Advisory Services</label></td></tr>
<tr><td><label><input type="checkbox" id="BusinessApplicationsandIntegration" name="Business Applications and Integration">Business Applications and Integration</label></td></tr>
<tr><td><label><input type="checkbox" id="BusinessOperations" name="Business Operations">Business Operations</label></td></tr>
</table>
Or here on jsFiddle
I'm seeking:
As you can see, the results are very hit and miss.
By the way, I got this basic function from this question here on Stack Overflow:
Live search through table rows
Upvotes: 1
Views: 73
Reputation: 7716
You were close , in your fiddle you weren't including jQuery and in your function just get rid off this line
if (index === 0) return;
Upvotes: 1