Question

How can i search in multiple tables? I have this code, but this only works for one of my tables. I have a total of 4 tables.

This is my code for search after “something” in my table.

$(document).ready(function() {
    $('#search').keyup(function() {
        searchTable($(this).val());
    });
});

function searchTable(inputVal) {
    var table = $('#searchTable');
    table.find('tr').each(function(index, row) {
        var allCells = $(row).find('td');
        if(allCells.length > 0) {
            var found = false;
            allCells.each(function(index, td) {
                var regExp = new RegExp(inputVal, 'i');
                if(regExp.test($(td).text())) {
                    found = true;
                    return false;
                }
            });
            if(found == true) $(row).show();
            else $(row).hide();
        }
    });
}

I’ve stripped my tables for code so that it looks more manageable out

The problem lies in “search tabe “only run Tables 1 through and not the remaining

Table 1:

<table class="table" id="searchTable">

Table 2:

<table class="table" id="searchTable">

Table 3:

<table class="table" id="searchTable">

Table 4:

<table class="table" id="searchTable">

Answer 1

Your problem is because of the IDs. IDs must be unique to each element, so once jQuery pulls the first ID it stops looking for any others.

Replace $('#searchTable') with $('.table') and the problem should be fixed.

You should also give those tables unique IDs or remove the IDs altogether if they’re not used.

From the HTML specification: “There must not be multiple elements in a document that have the same id value.” http://www.w3.org/TR/html-markup/global-attributes.html