Filter/Search Table HTML

Question

I have a problem with search table. I'm using code from W3 and this code is for filtering one column. Will someone make it so that it filters two columns at a time? For example, Name and Lastname

Code:

<script> 
function myFunction() { 

    table, tr, td, i; input = document.getElementById("myInput"); 
    filter = input.value.toUpperCase(); table = 
    document.getElementById("myTable"); 
    tr = table.getElementsByTagName("tr");
    for (i = 0; i < tr.length; i++) { 
        td = tr[i].getElementsByTagName("td")[0]; 
        if (td) { 
            if (td.innerHTML.toUpperCase().indexOf(filter) > -1) { 
                tr[i].style.display = ""; 
            } 
            else { 
                tr[i].style.display = "none"; 
            } 
        }
     }
 } 
 </script>

Link to code: https://www.w3schools.com/howto/howto_js_filter_table.asp

THANK YOU!

Answer 1

You should search for second td also.

function myFunction() {    
    table, tr, td, i; input = document.getElementById("myInput"); 
    filter = input.value.toUpperCase(); 
    table =document.getElementById("myTable"); 
    tr = table.getElementsByTagName("tr");
    for (i = 0; i < tr.length; i++) { 
        td = tr[i].getElementsByTagName("td")[0]; 
        td2 = tr[i].getElementsByTagName("td")[1];
        if (td && td2) { 
           if (td.innerHTML.toUpperCase().indexOf(filter) > -1 || td2.innerHTML.toUpperCase().indexOf(filter) > -1) { 
             tr[i].style.display = ""; 
           } 
           else { tr[i].style.display = "none"; } 
        }
    }
} 

Answer 2

You can use a simple js framework called Listjs

http://listjs.com/ to search, sort or filter data