Alle Input-Felder in Tabellenzeile ansprechen

[Andreas Korthaus]

Hi!

es keimt in mir Das Fragezeichen. Wieso mittels JS? Der Code legt die Vermutung nahe, daß er über eine Schleife erzeugt wird und Deiner Beschreibung zwar nicht zu entnehmen, aber vermutlich soll nun jede zweite Zeile eine Schattierung bekommen:

Nein, das würde ich hinbekommen. Ich will wie bei phpmyadmin die komplette Zeile bei onmouseover einfärben. Nur ist das nicht so einfach möglich wie bei phpmyadmin, eben wegen der Input-Felder. Und ja, ich verwende eine Schleife zum Erzeugen der Zeilen, ich verwende sogar in jedem Schleifendurchlauf eine Schleife zum Erzeugen der Input-Felder. Das ist zwar höchst ineffektiv - das weiß ich wohl, ist aber im Moment nicht anders machbar, eben weil eine so erzeugte Tabelle 5 Spalten haben kann, oder auch 15, das ist abhängig von anderen Dingen.

Dadurch dass ich die Tabelle komplett dynamisch in PHP erzeuge, habe ich hier auch die Möglichkeit, CSS, Javascript und JS-Funktionsaufruf ebenfalls durch PHP zu erzeugen, also sowas wie Du in Deinem Beispiel auch machst.

Sollte jede Zeile eine eigene Farbe kekommen, wird sich dies sicher über ein Datenfeld realisieren lassen, was die einzelnen CSS-Klassen mit ihren Definitionen in Abfolge des zu generierenden HTML nebenher bereitstellt.

Hm? Das verstehe ich nicht. Was meinst Du für ein Datenfeld? Könnte ich das evtl. für meine onmouseover Zwecke nutzen? Jedenfalls gibt es bei mir nur 2 Farben, einmal "normal" und einmal "onmouseover". Wenn ich mit der Maus über eine Zeile komme, will ich per onmouseover eine JS-Funktion aufrufen, die die aktuelle Zeile einfärbt, komplett, <tr> wäre leicht, aber eben noch die ganzen input-felder.

Mit JS hättest Du die Möglichkeit über node auf die einzelnen Zeilen und dann deren Inhalt zuzugreifen. Allerdings würde das die Dokumente unnötig aufblähen.

Die IDs solltest Du in dem Falle durchlaufend als (str) "tr".$i für $i++ mit PHP erstellen.

<table>
<tr id="tr0">
  <td><input type="text" name="data[1][1]"></td>
  <td><input type="text" name="data[1][2]"></td>
  <td><input type="text" name="data[1][3]"></td>
</tr>
<tr id="tr1">
  <td><input type="text" name="data[2][1]"></td>
  <td><input type="text" name="data[2][2]"></td>
  <td><input type="text" name="data[2][3]"></td>
</tr>
</table>

Für DIESES Konstrukt würde folgendes Javascript funktionieren:

for(i=0;document.getElementById('tr'+i);i++)
  {
  for(j=1;document.getElementById('tr'+i).childNodes[j];j+=2)
   {
   document.getElementById('tr'+i).childNodes[j].firstChild.style.background='#808080'
   }
  }

Oh, das sieht gut aus ;-)
Damit probiere ich mal rum! Evtl. könnte ich auch mit this arbeiten,oder? Funktioniert das in IE5?

ACHTUNG: Für <tr><td></td></tr> (ohne Leerräume) gilt dies nicht mehr! Im Zweifel mit dem Dom Inspector arbeiten.

Danke Dir!

Grüße
Andreas