CODEWITHSUNDEEP
javascriptjquerypagination
Griezmann
Griezmann

Reputation: 55

Searching Through Paginated Tables - JS

I am beginner with JS. I have a table of about 100 records from my database but then, it has been paginated to 10 on a page. When i search with my query, it does not search the whole table but then the current page.

How can i get my query to search the whole table instead just the current page please?

<script>
function myFunction() {
  // Declare variables 
  var input, filter, table, tr, td, i;
  input = document.getElementById("myInput");
  filter = input.value.toUpperCase();
  table = document.getElementById("table");
  tr = table.getElementsByTagName("tr");

  // Loop through all table rows, and hide those who don't match the search query
  for (i = 0; i < tr.length; i++) {
    td = tr[i].getElementsByTagName("td")[1];
    if (td) {
      if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
        tr[i].style.display = "";
      } else {
        tr[i].style.display = "none";
      }
    } 
  }
}
</script>

Upvotes: 2

Views: 3213

Answers (1)

ToniWidmo
ToniWidmo

Reputation: 509

If you used jQuery DataTables it would probably make your task a lot easier. Otherwise I'd suggest you try replacing tr[i].style.display = ""; with tr[i].hide() and tr[i].show().

Upvotes: 2

Related Questions