Zeilennummer einer Tabelle abfragen

[Stefan]

Hallo,

ich sitze seit einer geschlagenen Stunde an einem Problem, bei dem ich anfangs von einer schnellen Lösung ausgegangen bin.

Nehmen wir an, ich habe eine Tabelle mit 3 Zeilen und 2 Spalten und vergebe an die 2. Zeile eine ID:

  
<table>  
  <tr>  
    <td></td>  
    <td></td>  
  </tr>  
  <tr id="wievielte_zeile_ist_das">  
    <td></td>  
    <td></td>  
  </tr>  
  <tr>  
    <td></td>  
    <td></td>  
  </tr>  
</table>  

Anfangs vermutete ich, dass es mithilfe der ID ein leichtes ist die Zeilennummer ausgeben zu lassen, leider wurde ich eines besseren belehrt. Ich habe alle möglichen Konstellationen ausprobiert aber nichts hat das erwünschte Ergebnis (in diesem Fall 2) gebracht.

Ist das was ich vorhabe überhaupt möglich? ... oder befinde ich mich auf dem Holzweg?

Ich würde mich über jede Art von Hilfestellung freuen. Ich bin auch nicht Lesefaul, also wenn jemand einen Link oder ähnliches hat, der mir weiterhelfen könnte, dann immer her damit ;)

gruß Stefan

[Beat]

Anfangs vermutete ich, dass es mithilfe der ID ein leichtes ist die Zeilennummer ausgeben zu lassen, leider wurde ich eines besseren belehrt.

No Way. getElementsById holt dir genau ein Object aus dem Dom ohne dir Information zum Umgebenden Kontext zu geben.

Ich habe alle möglichen Konstellationen ausprobiert aber nichts hat das erwünschte Ergebnis (in diesem Fall 2) gebracht.

Ist das was ich vorhabe überhaupt möglich? ... oder befinde ich mich auf dem Holzweg?

Du musst durch die Collection der tr Elemente iterieren und fragen, ist im tr object für die aktuelle Zeile (den Wert des Iterators) eine id mit Namen so und so vorhanden?

mfg Beat

[Stefan]

Sooo... ich habe nun eine Lösung für mein Problem gefunden! Nachdem ich einge Zeit im DOM-Inspector gesucht habe, ist mir die Variable rowIndex aufgefallen.

Für alle die dasselbe Problem wie ich haben sollten, nochmal die komplette Problemlösung:

HTML:

  
<table>  
  <tr>  
    <td></td>  
    <td></td>  
  </tr>  
  <tr id="wievielte_zeile_ist_das">  
    <td></td>  
    <td></td>  
  </tr>  
  <tr>  
    <td></td>  
    <td></td>  
  </tr>  
</table>  

JAVASCRIPT:

  
var zeile = document.getElementById("wievielte_zeile_ist_das").rowIndex+1;  
alert(zeile); // Ausgabe: 2  

Ich weiß nicht in wiefern die Variable rowIndex in den gängigen Browsern verfügbar ist aber im IE8 und Firefox 3 funktioniert diese Lösung!

Danke nochmal an alle, die mir zu der späten Stunde noch geholfen haben. Ich wünsche euch noch einen schönen Abend ;)

gruß Stefan

[Struppi]

Sooo... ich habe nun eine Lösung für mein Problem gefunden! Nachdem ich einge Zeit im DOM-Inspector gesucht habe, ist mir die Variable rowIndex aufgefallen.

Stimmt, du hast ja schon das TR Element, ich dachte du geht von einer Zelle aus.

Diese haben übrigens die Eigenschaft cellIndex, mit der man die Spalte ermitteln kann.

Das können alle gängigen Browser - sogar der IE 6

Struppi.

[ChrisB]

Hi,

Sooo... ich habe nun eine Lösung für mein Problem gefunden! Nachdem ich einge Zeit im DOM-Inspector gesucht habe, ist mir die Variable rowIndex aufgefallen.

Ich weiß nicht in wiefern die Variable rowIndex in den gängigen Browsern verfügbar ist aber im IE8 und Firefox 3 funktioniert diese Lösung!

Diese Eigenschaft ist bereits in DOM Level 1 definiert worden - sollten also alle irgendwie relevanten Browser unterstützen.

MfG ChrisB

[Shadowcrow]

'ǝɯɐu$ ıɥ

Vlt. hilft dir das?

ssnɹƃ
ʍopɐɥs

[Struppi]

Anfangs vermutete ich, dass es mithilfe der ID ein leichtes ist die Zeilennummer ausgeben zu lassen, leider wurde ich eines besseren belehrt. Ich habe alle möglichen Konstellationen ausprobiert aber nichts hat das erwünschte Ergebnis (in diesem Fall 2) gebracht.

Ist das was ich vorhabe überhaupt möglich? ... oder befinde ich mich auf dem Holzweg?

Den Wert kannst so ermitteln: [zelle].parentNode.rowIndex

Struppi.

[Struppi]

Den Wert kannst so ermitteln: [zelle].parentNode.rowIndex

Ach und hier noch der Link: http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#tr
Struppi.

[Kai345]

[latex]Mae  govannen![/latex]

<table>
  <tr>
    <td></td>
    <td></td>
  </tr>
  <tr id="wievielte_zeile_ist_das">
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
  </tr>
</table>

>   
> Anfangs vermutete ich, dass es mithilfe der ID ein leichtes ist die Zeilennummer ausgeben zu lassen, leider wurde ich eines besseren belehrt. Ich habe alle möglichen Konstellationen ausprobiert aber nichts hat das erwünschte Ergebnis (in diesem Fall 2) gebracht.  
>   
> Ist das was ich vorhabe überhaupt möglich? ... oder befinde ich mich auf dem Holzweg?  
  
vermutlich (Ich habe in Sachen Javascript mit Tabellen nicht so viel gemacht; daher kann es eine einfachere Lösung geben) das Element holen, dann in einer Schleife per parentNode und Vergleich von nodeName bis zum Table-Element hochhangeln (ich würde mich hier nicht auf das augenscheinlich richtige  
`document.getElementById("wievielte_zeile_ist_das").parentNode`{:.language-javascript}  
verlassen, auch wenn das table-Element direkter Vorfahre zu sein scheint, manchmal wird implizit ein tbody eingefügt)  
  
Dann die Tabellenzeilen  (.rows) durchiterieren und jeweils vergleichen  
  
also quasi so:  
  
~~~javascript
var row = document.getElementById("wievielte_zeile_ist_das");  
if (row) {  
    var el = row.parentNode;  
    // Test auf document.body verhindert Endlosschleife, wenn table nicht gefunden wird  
    while (el.nodeName.toLowerCase() !== 'table' && el !== document.body) {  
        el = el.parentNode;  
    }  
    if (el.nodeName.toLowerCase() === 'table') {  
        var rows = el.rows;  
        for (var i = 0, l = rows.length; i < l; i += 1) {  
            if (rows[i] === row) {  
                alert("Es ist die " + (i+1) + ". Tabellenzeile");  
                break;  
            }  
        }  
    }  
}

Das sollte eigentlich auch bei etwas älteren Browsern funktionieren. In IE 5.5 + IE 6 standalone funktioniert es jedenfalls.

Cü,

Kai

[Kai345]

[latex]Mae  govannen![/latex]

Ok, vergiß es. rowIndex kannte ich nicht.

Cü,

Kai

[Gunnar Bittersmann]

@@Kai345:

nuqneH

vermutlich (Ich habe in Sachen Javascript mit Tabellen nicht so viel gemacht; daher kann es eine einfachere Lösung geben) das Element holen, dann in einer Schleife per parentNode und Vergleich von nodeName

Performanter dürfte sein (besonders, wenn die Ermittlung der Zeilennummer mehrmals erfolgt), initial in einer Schleife die 'tr' duchnumerieren (speichern in einer Eigenschaft des jeweiligen Elementobjekts), dann kann man sie bei Bedarf einfach abrufen.

Aber wie schon gesagt wurde, solch eine Eigenschaft gibt es bereits.

bis zum Table-Element hochhangeln (ich würde mich hier nicht auf das augenscheinlich richtige
document.getElementById("wievielte_zeile_ist_das").parentNode
verlassen, auch wenn das table-Element direkter Vorfahre zu sein scheint, manchmal wird implizit ein tbody eingefügt)

„Manchmal“ heißt bei _jedem_ Tagsoup-Parser (also bei HTML und XHTML als 'text/html').

Und man muss nicht bis zum 'table'-Element hoch, denn wenn 'tbody' vorhanden ist, sind ja die 'tr' dessen Geschwisterkinder.

Qapla'

[Kai345]

[latex]Mae  govannen![/latex]

verlassen, auch wenn das table-Element direkter Vorfahre zu sein scheint, manchmal wird implizit ein tbody eingefügt)

„Manchmal“ heißt bei _jedem_ Tagsoup-Parser (also bei HTML und XHTML als 'text/html').

Jo. Deshalb stellte ich auch beim Test in verschiedenen Browsern unterschiedliches Verhalten fest und habe daraufhin die while-Schleife genommen, da ich die Tabelle und den Code kurzerhand lokal in meine Site eingebaut habe, und diese wird hier für richtige Browser als application/xhtml+xml ausgeliefert.

Und man muss nicht bis zum 'table'-Element hoch, denn wenn 'tbody' vorhanden ist, sind ja die 'tr' dessen Geschwisterkinder.

Geschwister? Hätte ich jetzt nicht angenommen. Ich bin davon ausgegangen, daß der Browser die Struktur auf

<table>  
    <tbody>  
        <tr></tr>  
        <tr></tr>  
    </tbody>  
</table>  

erweitert. Aber es ist mir noch viel zu früh, um das jetzt nachzurecherchieren/-testen, bin noch nicht richtig wach. Kaffee muß erst seine Wirkung entfalten :)

Cü,

Kai

[Gunnar Bittersmann]

@@Kai345:

nuqneH

Und man muss nicht bis zum 'table'-Element hoch, denn wenn 'tbody' vorhanden ist, sind ja die 'tr' dessen Geschwisterkinder.

Geschwister? Hätte ich jetzt nicht angenommen. Ich bin davon ausgegangen, daß der Browser die Struktur auf

<table>

<tbody>
        <tr></tr>
        <tr></tr>
    </tbody>
</table>

>   
> erweitert.  
  
Ja.  
  
(1) Die 'tr' sind Geschwister.  
(2) Die 'tr' sind Kinder von 'tbody'.  
  
Sagte ich doch.  
  
  

> […] bin noch nicht richtig wach. Kaffee muß erst seine Wirkung entfalten :)  
  
Gönn dir noch einen! ;-)  
  
Qapla'

-- 
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.  
(Mark Twain)

[Matti Maekitalo]

Tach auch.

Und man muss nicht bis zum 'table'-Element hoch, denn wenn 'tbody' vorhanden ist, sind ja die 'tr' dessen Geschwisterkinder.

Naja, weder muss das aktuelle tbody-Element das einzige sein, noch muss ein thead-Element fehlen. Bei der Frage, die wievielte Zeile ein tr-Element nun ist, sollte daher zunächst einmal klar stellen, ob sich der das "wievielte" auf den aktuellen tbody oder auf die komplette sichtbare Tabelle bezieht.

Habe gerade nix zum ausprobieren, aber ich würde mich zB nicht direkt drauf verlassen, dass rowIndex aktualisiert wird, wenn ich eine "vorherige" Zeile mittels display:none ausblende.

Bis die Tage,
Matti

[ChrisB]

Hi,

Bei der Frage, die wievielte Zeile ein tr-Element nun ist, sollte daher zunächst einmal klar stellen, ob sich der das "wievielte" auf den aktuellen tbody oder auf die komplette sichtbare Tabelle bezieht.

Das ist doch eindeutig definiert.

Habe gerade nix zum ausprobieren, aber ich würde mich zB nicht direkt drauf verlassen, dass rowIndex aktualisiert wird, wenn ich eine "vorherige" Zeile mittels display:none ausblende.

Lässt sich mittels eines SELFHTML-Anzeigebeispiels und Firebug doch ganz fix überprüfen: Nein, der rowIndex ändert sich nicht, wenn ein davor liegendes TR per display:none versteckt wurde.
Der ändert sich erst, wenn es wirklich aus dem DOM entfernt wird (removeChild o.ä.)

MfG ChrisB

[Matti Maekitalo]

Tach auch.

Bei der Frage, die wievielte Zeile ein tr-Element nun ist, sollte daher zunächst einmal klar stellen, ob sich der das "wievielte" auf den aktuellen tbody oder auf die komplette sichtbare Tabelle bezieht.

Das ist doch eindeutig definiert.

Ich meinte auch nicht die technische Definition von "rowIndex = Zeilennummer", sondern die fachliche. Wie du selbst feststellst (Bsp ausgeblendete Zeilen), ist der rowIndex eben nicht der Index der angezeigten Zeilen. Insofern hilft auch der Hinweis "rowIndex" nicht weiter, wenn dem TE nicht klar ist, was er will.

Bis die Tage,
Matti

[ChrisB]

Hi,

Ich meinte auch nicht die technische Definition von "rowIndex = Zeilennummer", sondern die fachliche. Wie du selbst feststellst (Bsp ausgeblendete Zeilen), ist der rowIndex eben nicht der Index der angezeigten Zeilen.

Nein, sondern der tatsächlich vorhandenen Zeilen - das ist doch aber auch recht logisch, da wir uns hier schließlich im DOM bewegen.

MfG ChrisB

[Matti Maekitalo]

Tach auch.

Ich meinte auch nicht die technische Definition von "rowIndex = Zeilennummer", sondern die fachliche. Wie du selbst feststellst (Bsp ausgeblendete Zeilen), ist der rowIndex eben nicht der Index der angezeigten Zeilen.

Nein, sondern der tatsächlich vorhandenen Zeilen - das ist doch aber auch recht logisch, da wir uns hier schließlich im DOM bewegen.

Und um den Diskussionszweig abschließen zu können:
a) ist mir das klar (bzw. habe ich erwartet, in meinem ersten posting habe ich es nicht sicher gewusst, was ich auch schrieb) und
b) trifft es das, was ich gesagt habe.

Der OP soll sich klar werden, was er will. rowIndex _kann_ unter bestimmten Umständen ungefähr das sein, was er sucht. Unter anderen Umständen ist es dies nicht.

Da wir aber nicht die Umstände kennen, ist ein stures Festhalten an "rowIndex ~= Zeilennummer" nicht korrekt.
Nicht anderes schrieb ich.

Bis die Tage,
Matti

[Struppi]

Der OP soll sich klar werden, was er will. rowIndex _kann_ unter bestimmten Umständen ungefähr das sein, was er sucht. Unter anderen Umständen ist es dies nicht.

Naja, das scheint ja schon längst geklärt zu sein

Da wir aber nicht die Umstände kennen, ist ein stures Festhalten an "rowIndex ~= Zeilennummer" nicht korrekt.

Bis jetzt war es ein Vorschlag, von mehreren. Inwiefern siehst du hier ein stures festhalten?

Struppi.