nicosammito
Neues Mitglied
HTML:
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
box-sizing: border-box;
}
#myInput {
background-image: url('/css/1.png');
background-position: 10px 10px;
background-repeat: no-repeat;
width: 100%;
font-size: 16px;
padding: 12px 20px 12px 40px;
border: 1px solid #ddd;
margin-bottom: 12px;
}
#myTable {
border-collapse: collapse;
width: 100%;
border: 1px solid #ddd;
font-size: 18px;
}
#myTable th, #myTable td {
text-align: left;
padding: 12px;
}
#myTable tr {
border-bottom: 1px solid #ddd;
}
#myTable tr.header, #myTable tr:hover {
background-color: #f1f1f1;
}
</style>
</head>
<body>
<h2>Mitarbeiter</h2>
<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Suche..." title="Type in a name">
<table id="myTable">
<tr class="header">
<th style="width:20%;">Name</th>
<th style="width:20%;">Tournummer</th>
<th style="width:20%;">Pers. Nr.</th>
<th style="width:20%;">Mobil</th>
<th style="width:20%;">Arbeitsgebiet</th>
</tr>
<tr>
<td>Sascha Schnabel</td>
<td>1601</td>
<td>2765030662</td>
<td><a href="tel:015756816660">015756816660</a></a></td>
<td>Hattingen</td>
</tr>
<tr>
<td>Manfred Kail</td>
<td>1600</td>
<td>2765028012</td>
<td><a href="tel:01717892470">01717892470</a></a></td>
<td>Unternehmer</td>
</tr>
<tr>
<td>Name3</td>
<td><a href="tel:">123456789</a></td>
</tr>
<tr>
<td>Name3</td>
<td><a href="tel:">123456789</a></td>
</tr>
<tr>
<td>Name4</td>
<td><a href="tel:">123456789</a></td>
</tr>
<tr>
<td>Name5</td>
<td><a href="tel:">123456789</a></td>
</tr>
<tr>
<td>Name6</td>
<td><a href="tel:">123456789</a></td>
</tr>
<tr>
<td>Name7</td>
<td><a href="tel:">123456789</a></td>
</tr>
</table>
<script>
function myFunction() {
var input, filter, table, tr, td, i;
input = document.getElementById("myInput");
filter = input.value.toUpperCase(4);
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>
</body>
</html>
ich habe eine Suchfunktion mit einer Tabelle verknüpft und möchte nun durch die Suchfunktion Informationen aus der Tabelle bekommen.
Leider ließt er nur die erste Spalte aus.
Warum ließt er nicht alle Spalten aus?
Kann mir da jemand helfen?
Hier der Code: