I got a project in which in which i got some data in format of html table and asked to make a web page where you put in the phone number of a person and when you click the button you will get the result filtered out from the data. You will not be able to see someone's else data without knowing their phone number. I made it till here-
function myFunction() {
// Declare variables
var input, filter, table, tr, td, i, txtValue;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
table = document.getElementById("myTable");
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")[0];
if (td) {
txtValue = td.textContent || td.innerText;
if (txtValue.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
}
</script>
<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search">
<table id="myTable">
<tr class="header">
<th>Phone</th>
<th>Name</th>
<th>DOB</th>
</tr>
<tr>
<td>1239832</td>
<td>Rhythm</td>
<td>Class 10</td>
</tr>
<tr>
<td>2198320</td>
<td>Rekha</td>
<td>Class 11</td>
</tr>
<tr>
<td>21397293</td>
<td>Arun</td>
<td>Class 11</td>
</tr>
</table>
