IE: myTr.cells ist nach Klonen einer Tabellenzeile leer - Bug?

[BeAT4]

Hallo zusammen,

ich möchte eine Tabellenzeile klonen, aus dem erzeugten Klon eine Tabellenzelle entfernen und die Zeile dann in eine neue Tabelle einfügen.
Das ganze funktioniert auch in echten Browsern, im IE allerdings nicht.

Anbei der HTML Codeschnipsel:

  
<!-- Quell-Tabelle -->  
<table>  
 <tr onclick="cloneMe(this);">  
  <td>1</td>  
  <td>2</td>  
  <td>3</td>  
 </tr>  
 <tr onclick="cloneMe(this);">  
  <td>4</td>  
  <td>5</td>  
  <td>6</td>  
 </tr>  
</table>  
  
<!-- Ziel-Tabelle -->  
<table id="tDestination">  
 <tr>  
  <th>A</th>  
  <th>B</th>  
 </tr>  
</table>  
  

Der dazugehörige JavaScript Code:

  
function cloneMe(trElement)  
{  
 // TR-Element klonen  
 var clonedTrElement = trElement.cloneNode(true);  
  
 // dritte Zelle entfernen  
 clonedTrElement.deleteCell(2);  
  
 // TR-Element der Ziel-Tabelle hinzufügen  
 var destTable = document.getElementById('tDestination');  
 destTable.appendChild(clonedTrElement);  
}  

Beim IE ist nach dem klonen des <tr> Elementes die Eigenschaft "cells" undefined.

Wie bekomme ich so was hin, dass es auch im IE funktioniert?

Danke im Voraus für Eure Hilfe.
Grüße
BeAT4

[Struppi]

Wie bekomme ich so was hin, dass es auch im IE funktioniert?

Der IE braucht für sowas ein explizites tbody Element, dem du dann auch die neue Reihe hinzufügen musst.

Struppi.

[BeAT4]

Der IE braucht für sowas ein explizites tbody Element, dem du dann auch die neue Reihe hinzufügen musst.

Danke für den Hinweis. Habe ich geändert.
Das hilft mir aber nur bedingt weiter. Wenn ich die geklonte Zeile dem <tbody> Element hinzufüge wird die komplette Zeile hinzugefügt. Ich möchte aber die letzte Zelle aus dieser Zeile entfernen.

Das geht aber nach wie vor nicht, da der IE clonedTrElement.deleteCell(2); nicht ausführen kann.
clonedTrElement.cells ist nämlich nach dem Klonen "undefined". Hier sollte aber ein Array mit Zellen-Objekten drin sein.

Grüße
BeAT4

[Struppi]

Das geht aber nach wie vor nicht, da der IE clonedTrElement.deleteCell(2); nicht ausführen kann.
clonedTrElement.cells ist nämlich nach dem Klonen "undefined". Hier sollte aber ein Array mit Zellen-Objekten drin sein.

Hast du mal probiert die Spalten nach dem Einfügen zu entfernen?

Struppi.

[Harlequin]

Yerf!

Beim IE ist nach dem klonen des <tr> Elementes die Eigenschaft "cells" undefined.

Kann ich jetzt so nicht bestätigen, da ich soetwas in einem eigenen Script problemlos verwende.

Wie bekomme ich so was hin, dass es auch im IE funktioniert?

Evtl. liegt es daran, das ich die duplizierte Zeile erst dem TBody der Zieltabelle hinzufüge und dann erst auf die Zellen zugreife. Probier doch mal aus, was passiert, wenn du die Reihenfolge vertauschst, denn irgendwie hab ich da noch was in Erinnerung, dass es Probleme gibt, wenn man Elemente bearbeitet die noch "in der Luft hängen".

Gruß,

Harlequin

[BeAT4]

Evtl. liegt es daran, das ich die duplizierte Zeile erst dem TBody der Zieltabelle hinzufüge und dann erst auf die Zellen zugreife. Probier doch mal aus, was passiert, wenn du die Reihenfolge vertauschst, denn irgendwie hab ich da noch was in Erinnerung, dass es Probleme gibt, wenn man Elemente bearbeitet die noch "in der Luft hängen".

yepp!!
so isses. Man muss zuerst die Zeile dem <tbody> hinzufügen

Der Js-Code sieht nun folgendermaßen aus:

  
function cloneMe(trElement)  
{  
 // TR-Element klonen  
 var clonedTrElement = trElement.cloneNode(true);  
 // TR-Element der Ziel-Tabelle hinzufügen  
 var destTable = document.getElementById('tDestination');  
 //*** zuerst die Zeile dem <tbody> hinzufügen bevor dann die Zellen entfernt werden****  
 destTable.getElementsByTagName('TBODY')[0].appendChild(clonedTrElement);  
 // dritte Zelle entfernen  
 clonedTrElement.deleteCell(2);  
  
}  

Danke vielmals
BeAT4