Mauszeigerposition in Tabelle
mschuett
- javascript
Hallo zusammen!
Ich habe mehrere Exceldateien mit unzähligen tabellarischen Werten zur Verfügung, auf die in einer Webapp Bezug genommen werden soll.
Das Problem dabei ist, dass die Tabellen nicht nur angezeigt werden sollen, sondern deren Werte (also die Zelleninhalte) müssen mit einem Mausklick in ein Formular übernommen werden. Ich strebe nach einer optimierten Lösung.
Mein Lösungsweg ist folgender:
Ich konvertiere die Exceldateien mit MS Excel in HTML-Dateien, jede Zelle bekommt einen Eventhandler (onclick()) und in jeder Datei wird zusätzlich ein externes JS eingebunden (Es werden mit den jeweils angeklickten Werten Summierungen gebildet, dies kann aber vernachlässigt werden).
Was zu optimieren wäre:
Nachdem die Tabellen seehr gross sind, also wirklich viele Zellen enthalten, benötige ich dementsprechend lange um alle mit einem Eventhandler zu versehen (Copy&Paste-Methodik).
Ist eine Möglichkeit denkbar, einen Eventhandler aussschliesslich im Tabellenkopf zu definieren, um dann nach einem Klick auf die Zelle mittles Erkennung der Mausposition die geklickte Zelle zu ermitteln?
Nachdem die Tabellen seehr gross sind, also wirklich viele Zellen enthalten, benötige ich dementsprechend lange um alle mit einem Eventhandler zu versehen (Copy&Paste-Methodik).
Ist eine Möglichkeit denkbar, einen Eventhandler aussschliesslich im Tabellenkopf zu definieren, um dann nach einem Klick auf die Zelle mittles Erkennung der Mausposition die geklickte Zelle zu ermitteln?
Suchen & Ersetzen mit einem ordentlichen Editor - besser: garnicht erst die eventhandler händisch einfügen lassen. Ich würde das Excel-File als CSV exportieren, mit einer Scriptsprache lesen (PHP z.B.) und mein gewünschtes HTML ausgeben. fgetcsv() sollte hier ein Anfang sein.
Die Exceldateien enthalten nicht nur die Tabellen mit den benötigten Werten, sondern Zusatzinfos (Texte, Bilder), die die Auswahl der gewünschten Werte beeinflussen.
Die Exceldateien enthalten nicht nur die Tabellen mit den benötigten Werten, sondern Zusatzinfos (Texte, Bilder), die die Auswahl der gewünschten Werte beeinflussen.
Was hindert dich nun mittels "Suchen und Ersetzen" zu arbeiten anstatt mit händischem Einfügen? Die Eventhandler lassen sich übrigens auch mittels JavaScript einfügen.
Was hindert dich nun mittels "Suchen und Ersetzen" zu arbeiten anstatt mit händischem Einfügen? Die Eventhandler lassen sich übrigens auch mittels JavaScript einfügen.
Das Problem bei "Suchen und Ersetzen" in diesem Fall ist, dass die konvertierten HTML-Files nur bedingt dazu taugen, ich also keine entsprechende Regel gefunden habe.
ABER: Du meinst ich könnte einer Tabelle eine ID geben und dann mittels onload() im Body-Tag die Eventhandler zu den Zellen hinzufügen?
Das Problem bei "Suchen und Ersetzen" in diesem Fall ist, dass die konvertierten HTML-Files nur bedingt dazu taugen, ich also keine entsprechende Regel gefunden habe.
So eine Regel zu finden kann echt schwierig sein :)
Ersetze '<td
' durch '<td onclick="foo();"
'
ABER: Du meinst ich könnte einer Tabelle eine ID geben und dann mittels onload() im Body-Tag die Eventhandler zu den Zellen hinzufügen?
Zum Graphitstift, ja.
So eine Regel zu finden kann echt schwierig sein :)
Ersetze '<td
' durch '<td onclick="foo();"
'
Is nix mit dem simplen Ersetzen, ich sagte ja es sind viele Zusatzinfos in den Excelsheets enthalten und beim Konvertieren werden mehrere Tabellen pro Sheet angelegt, mit unterschiedlichen XML-Nodes versehen usw.
Das Ersetzen könnte also nur funktionieren wenn man zu einem markierten Bereich Bezug nehmen könnte.
»» ABER: Du meinst ich könnte einer Tabelle eine ID geben und dann mittels onload() im Body-Tag die Eventhandler zu den Zellen hinzufügen?
Zum Graphitstift, ja.
Meine Güte, dass ich da nicht selber drauf gekommen bin.
Is nix mit dem simplen Ersetzen, ich sagte ja es sind viele Zusatzinfos in den Excelsheets enthalten und beim Konvertieren werden mehrere Tabellen pro Sheet angelegt, mit unterschiedlichen XML-Nodes versehen usw.
Das Ersetzen könnte also nur funktionieren wenn man zu einem markierten Bereich Bezug nehmen könnte.
Ich kann's nicht nachvollziehen - das HTML-Ergebnis hat mit XML nicht wirklich viel zu tun (ausser die gemeinsamen SGML-Wurzeln), warum sollte man dort nicht alle vorkommen der Zeichenkette <td oder <th ersetzen können?. Wenn du eine valide HTML-Tabelle hast, MÜSSEN diese Zeichenketten (zumindest eine der beiden) vorkommen.
Ich kann's nicht nachvollziehen - das HTML-Ergebnis hat mit XML nicht wirklich viel zu tun (ausser die gemeinsamen SGML-Wurzeln), warum sollte man dort nicht alle vorkommen der Zeichenkette <td oder <th ersetzen können?. Wenn du eine valide HTML-Tabelle hast, MÜSSEN diese Zeichenketten (zumindest eine der beiden) vorkommen.
Das hast du prinzipiell natürlich Recht, jedoch würden dann alle Tabellen mit den Eventhandlern versehen werden (so sind zb auch Bilder in Tabellenzellen drinnen usw), es dürfen aber nur bestimmte Tabellen angeklickt werden können. Also müsste ich dies wieder manuell bereinigen.
Das hast du prinzipiell natürlich Recht, jedoch würden dann alle Tabellen mit den Eventhandlern versehen werden (so sind zb auch Bilder in Tabellenzellen drinnen usw), es dürfen aber nur bestimmte Tabellen angeklickt werden können. Also müsste ich dies wieder manuell bereinigen.
Ok, jetzt ist mir das klar - wobei Struppis Lösung natürlich viel feiner ist :)
Was zu optimieren wäre:
Nachdem die Tabellen seehr gross sind, also wirklich viele Zellen enthalten, benötige ich dementsprechend lange um alle mit einem Eventhandler zu versehen (Copy&Paste-Methodik).
Ist eine Möglichkeit denkbar, einen Eventhandler aussschliesslich im Tabellenkopf zu definieren, um dann nach einem Klick auf die Zelle mittles Erkennung der Mausposition die geklickte Zelle zu ermitteln?
Ja, die gibt es.
function get_event_element(e) {
return e && e.srcElement ? e.srcElement : e.target;
}
<table onclick="alert(get_event_element(event).innerHTML)">
<tr>
<td>Zelle</td>
</tr>
</table>
Struppi.
Hach, ich dank dir Struppi. Wenn das funktionieren sollte, kann ich meinen Lösungsweg grundsätzlich beibehalten.