1

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 &amp; Finance">Accounting &amp; 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:

  • Type in a "b" and only the first row remains. The rows with a "b" disappear.
  • Type in "ll" and "Alliances" remains (good), but also "Accounting & Finance" remains.
  • Type in "cc" and only "Accounting & Finance" remains. Good.

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

Andreas
  • 21,535
  • 7
  • 47
  • 56
birdus
  • 7,062
  • 17
  • 59
  • 89

1 Answers1

1

You were close , in your fiddle you weren't including jQuery and in your function just get rid off this line

fiddle

if (index === 0) return;
Renzo Calla
  • 7,486
  • 2
  • 22
  • 37
  • Great. I thought jsFiddle included jQuery automatically. Added it and commented out that line. When I type in "fi" or "b" for example, it still doesn't work. I tried that with yours, too, and it didn't work for "fi". Any other thoughts? – birdus Oct 05 '17 at 16:26
  • Ah. Looks like it's case sensitive. Didn't even think about that. Great! – birdus Oct 05 '17 at 16:27