1) Das 1. Objekt "HTML Code" enthält folgende Inhalte:

a) Diesen Code im Reiter "HTML Code":

<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names..">

b) Den gesamten CSS-Code aus dem Link oben im Reiter "Erweitert".

2) Das Objekt "Tabelle" mit den gewünschten Tabelleninhalten.

3) Das 2. Objekt "HTML Code" mit diesem Inhalt im Reiter "HTML Code":

a) Den gesamten JavaScript-Code vom Link oben.

b) Zusätzlich darunter noch diesen JavaScript-Code für die responsive Darstellung bei schmalen Bildschirmen:

</script>

<style> table {word-break: break-word;} </style><script> $( document ).ready(function() { $("table").css("width", "");});

</script>

4) Bei Objekt "Tabelle" muss noch die ID ermittelt werden für den JavaScript-Code.

Dazu im Raster das Tabellen-Objekt markieren und oben auf "Code" klicken, hier ist rechts oben die Objekt-ID angegeben, diese kopieren und dann beim JavaScript-Code - siehe 3)a) - die folgende Zeile an der fett markierten Stelle ändern:

Vorher:

table = document.getElementById("myTable");

Nachher:

table = document.getElementById("imTableObject_74_02");

Hinweis: Die Zahlen _74_02 sind nur ein Beispiel, da sie von Nutzer zu Nutzer und auch von Objekt zu Objekt unterschiedlich.