thonix: Tabellen editieren in verschiedenen Browsern

Beitrag lesen

Die Methode onclick wird als Funktion aufgerufen. Firefox ist übertrieben gutmütig, diesen Aufruf per String-Übergabe trotzdem umzusetzen, der IE verhält sich ausnahmsweise einmal korrekt.

Lediglich die Version 2 der Firefox spielt da mit. Die Version 3 lässt mich den Zelleninhalt nicht nochmals überschreiben:

  
        // Add shortcut to the cell  
        cell = document.getElementById(id);  
  
        // Cell text  
        // Textfield  
        celltext = document.getElementById("xx_"+id+"_text").value;  
  
        // Set cell text  
        cell.bgColor = "#FFCCCC";  
        cell.innerHTML = celltext;  

Anstelle der Zelle wird der Text > celltext < nicht in die Zelle, sondern in das Textfeld eingetragen. Die bgColor wird wiederum Richtig für die Zelle gesetzt.
Hat dies was mit der Verschachtelung zu tun ?

Richtig müßte es heißen:

cell.onclick = function(id) { return function() { editCelltoText(id); }}(id);

Beachte insbesondere die Closure (Verkapselung der Funktion), damit id korrekt übergeben werden kann, denn ansonsten kann es passieren, dass die Variable innerhalb der Funktion nicht referenziert werden kann. Eleganter wäre jedoch auf Dauer die Verwendung von "this".

Mit diesem Code funktioniert nun auch der IE - wie genau sich die erkapselung der Funktion zusammensetzt werde ich zu verstehen noch mal nachlesen.

Lese Dich in Objektorientierung bei JavaScript ein und nutze sie zu Deinem Vorteil. Dann kannst Du evtl. auch die Zellen mit modernen DOM-Aufrufen erstellen (bitte den tbody nicht vergessen, sonst mag IE nicht).

Wo finde ich etwas über die modernen DOM-Aufrufe ?
Kennst du evtl. hierfür eine schöne "einlese" Doku?

Danke
Thonix