JavaScript: Suchleiste für Excel Tabelle 

Excel Tabellen werden gern im Html Format verteilt, wenn es sich um eine grössere Zahl von Empfängern handelt. Das anhängende Beispiel demonstriert, wie man eine aus Excel exportierte Html Tabelle um eine Suchfunktion ergänzen kann. Der Code wird entweder in die Tabelle injiziert oder das Skript kann als eigenständige Applikation das Dokument einlesen.

Die interessante Fragestellung: ist, wie erfolgt der Zugriff auf die Tabelle? Es gibt grundsätzlich zwei Ansätze: Zum einen kann man den Dokument Quellcode interpretieren. Das ist möglich ohne den gesamten Syntaxbaum aufzuspannen, da wir bei einer autogenerierten Datei einen stereotypen Aufbau voraussetzen dürfen. Die andere Möglichkeit besteht darin das Dom Objekt zu durchsuchen. Das attraktive bei dieser Variante liegt darin, dass der Browser die Syntaxprüfung übernimmt. Aus praktischen Gründen wurde eine Mischform gewählt. Es hat sich gezeigt, dass Tabellen und Rows im Dom gut identifiziert werden können, die Repräsentation der Spalten ist hingegen bei den Browsern unterschiedlich. Deshalb werden im zweiten Schritt die Zeilen mit Hilfe des InnerHtml Attributs geparst. Die Spalten werden anhand der Tags <td*> und </td> identifiziert, eventuelle span Attribute werden allerdings nicht interpretiert.

zur Demo

------------------------------------------
erstellt 5.3.2020