Create Function To Search Entire Table And Not One Column Only
I have a table with a search function. Initially, my intention was to only search the contents of the first column. I would like to change this and create a search function that se
Solution 1:
Check if this is want you want,search by country/email/postal code : table-search.surge.sh
If you could give us a piece of your table so i can work my own function around it,anyway,this is what i found and its working(searches the entire table).Try to test this work in another file https://speedysense.com/filter-html-table-using-javascript/
Solution 2:
functionsearchTable() {
var input, filter, found, table, tr, td, i, j;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
table = document.getElementById("userinfo");
tr = table.getElementsByTagName("tr");
for (i = 0; i < tr.length; i++) {
// reading inner html from the td of tr
td = tr[i].getElementsByTagName("td");
for (j = 0; j < td.length; j++) {
// comparing the inner html if (td[j].innerHTML.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
}
else{
tr[i].style.display = "none";
}
}
}
}
<inputid='myInput'onkeyup='searchTable()'type='text'><tableid="userinfo"><tr><th>Company</th><th>Contact</th><th>Country</th></tr><tr><td>Alfreds Futterkiste</td><td>Maria Anders</td><td>Germany</td></tr><tr><td>Centro comercial Moctezuma</td><td>Francisco Chang</td><td>Mexico</td></tr><tr><td>Ernst Handel</td><td>Roland Mendel</td><td>Austria</td></tr><tr><td>Island Trading</td><td>Helen Bennett</td><td>UK</td></tr><tr><td>Laughing Bacchus Winecellars</td><td>Yoshi Tannamuri</td><td>Canada</td></tr><tr><td>Magazzini Alimentari Riuniti</td><td>Giovanni Rovelli</td><td>Italy</td></tr></table>
try the above working code
Post a Comment for "Create Function To Search Entire Table And Not One Column Only"