innerHTML bei Tabellenelementen

[musicmatthes]

Hallo ihr,

ich habe jetzt wirklich viel gesucht und auch eine Menge zu dem Thema gefunden, aber leider sind noch offene Fragen geblieben und ich hoffe jemand von euch kann mir weiterhelfen.

Ich möchte mit einer Funktion eine Tabelle Erweitern. In der tabelle sind TBody-Elemente. Jedes TBody ist ein "Eintrag" bestehend aus mehreren Zeilen und Spalten. Jetzt möchte ich das wenn jemand auf einen Button klickt, ein weiterer (leerer) Eintrag in der tabelle hinzugefügt wird.

Nach einigem Forschen bin ich dazu gekommen, diese Funktion hier dafür zu verwenden:

<script type=\'text/javascript\'>  
function newDienst(){  
var tbl = document.getElementById(\'maintable\');  
var Vorlage = document.getElementById(\'entry1\');  
var NewEntry = document.createElement(\'tr\');  
var NewText = Vorlage.innerHTML;  
NewEntry.innerHTML = NewText;  
tbl.appendChild(NewEntry);					  
};  
</script>

in toller Erwartung ausprobiert und:
FF, Safari, Chrome: Funktioniert.
IE: Funktioniert nicht =(

Ich hab mich schlau gemacht und viele Beiträge gefunden, wo Leute durch solch einen aufruf eine Fehlermeldung (unbekannter Laufzeitfehler) erhalten haben. Grund wäre, dass der IE nicht über innerHTML in Tabellenelemente (tbody, tr usw.) schreiben kann, da er die Readonly macht.

Dann:
Der IE zeigt es an, allerdings ohne Tabellenelemente. Also wenn da vorher:

<tr><td><b>ICH BIN EIN TEXT</b></td></tr>

stand, steht da nachher im IE

b>ICH BIN EIN TEXT</b>

Ich habe dann mal ein wenig geforscht und alle Beiträge die ich gefunden hatte waren sehr alt. wenn man auf dieser seite schaut innerHTML-Property - MSDN sieht man, dass es wohl jetzt doch writeable ist.

Habe ich irgendwo einen totalen denkfehler? denn er schreibt ja über innerHTML was im IE. nur die Tabellenelemente nicht. aber warum unterscheidet der das? ich blick da nicht durch und wäre sehr froh, wenn mir jemand etwas Licht ins dunkle bringen könnte =)

Liebe Grüße und danke für eure Hilfe,
MusicMatthes

[musicmatthes]

Ergänzung:

TBODY Element MSDN

auch hier in der Auflistung über das TBODY-Element steht drin:

innerHTML -> Gets or sets the HTML between the start and end tags of the object.

[dave]

Hi,

auch in meinem Test kann der IE über innerHTML keinen tbody bearbeiten.

Du könntest stattdessen .createElement, .appendChild etc. verwenden.

~dave

[Gunnar Bittersmann]

@@dave:

nuqneH

Du könntest stattdessen .createElement, .appendChild etc. verwenden.

Nicht die speziell für Tabellen vorgesehenen Funktionen insertRow() und insertCell()?

Qapla'

[dave]

Hi,
         ╔════════╗

Du ║könntest║ stattdessen […]

╚════════╝

Nicht die speziell für Tabellen vorgesehenen Funktionen insertRow() und insertCell()?

Man könnte auch die richtigen verwenden :D
Die kannte ich noch gar nicht…

~dave

[musicmatthes]

Hi,
         ╔════════╗

Du ║könntest║ stattdessen […]
         ╚════════╝
Nicht die speziell für Tabellen vorgesehenen Funktionen insertRow() und insertCell()?

Man könnte auch die richtigen verwenden :D
Die kannte ich noch gar nicht…

~dave

Ja das habe ich mir auch schon überlegt. Ist nur für mich wesentlich aufwendiger, da ein einzelner "Eintrag" aus einer Menge Zeilen und Spalten besteht. Ich habe aber einen "Vorlage-Eintrag" und könnte die Vorlage einfach übernehmen. Das wäre halt wesentlich einfacher und unkomplizierter, als in einem Script noch einmal alle Elemente separat zu erstellen.

hatte halt gehofft, dass es sonst noch irgendwie geht, aber wenn es da keine Möglichkeit gibt, werde ich das wohl über den anderen Weg machen müssen =)

Werde aber mit applieChild etc. arbeiten, da ich dann direkt auf die Elemente zugreifen kann und mit Inhalt füllen kann.

Sollte noch jemandem etwas dazu einfallen, bin ich über jede Hilfe dankbar.

euch beiden erst einmal vielen Dank für eure schnellen Antworten =)

lg, MusicMatthes

[dave]

Hi,

du könntest ja auch eine Funktion dafür verwenden.

~dave

[musicmatthes]

Hi,

du könntest ja auch eine Funktion dafür verwenden.

~dave

ja ich stehe gerade vor einem ganz anderen Problem, sodass dieses schon in den Hintergrund rutscht^^

Vielleicht hast du da ja auch eine Idee:

Ich habe innerhalb einer Zelle einen Popup Calender mit JS.

Ich kann zwar alle Möglichen elemente über JS in die Tabelle einfügen, aber jetzt muss ich theoretisch ein JS mit hilfe von JS in die Tabelle einfügen^^

ich verzweifel gleich xD

[dave]

Hi,

Vielleicht hast du da ja auch eine Idee:

Nein

Ich habe innerhalb einer Zelle einen Popup Calender mit JS.

Ich kann zwar alle Möglichen elemente über JS in die Tabelle einfügen, aber jetzt muss ich theoretisch ein JS mit hilfe von JS in die Tabelle einfügen^^

Wozu?

Mir ist nicht klar was du erreichen willst.

~dave

[musicmatthes]

Hi,

Vielleicht hast du da ja auch eine Idee:

Nein

Ich habe innerhalb einer Zelle einen Popup Calender mit JS.

Ich kann zwar alle Möglichen elemente über JS in die Tabelle einfügen, aber jetzt muss ich theoretisch ein JS mit hilfe von JS in die Tabelle einfügen^^

Wozu?

Mir ist nicht klar was du erreichen willst.

~dave

Hat sich gott sei dank schon erledigt =) war wesentlich einfacher als ich dachte =) es gibt tatsächlich ein script-Element =) alle Sorge war umsonst =) ich dank dir trotzdem =)

[ChrisB]

Hi,

Ja [DOM-Methoden zu benutzen] habe ich mir auch schon überlegt. Ist nur für mich wesentlich aufwendiger, da ein einzelner "Eintrag" aus einer Menge Zeilen und Spalten besteht. Ich habe aber einen "Vorlage-Eintrag" und könnte die Vorlage einfach übernehmen.

Das geht aber nicht nur mit innerHTML, sondern auch indem du dir einen Knoten einfach klonst.
Wenn du die Vorlage nicht 1:1 übernehmen willst (per innerHTML in deinem Beispiel war's so, aber ggf. war das vereinfacht), kannst du auch noch gezielt Eigenschaften des Klons neu setzen (z.B. für die ID wäre das vermutlich angebracht), Unterknoten gezielt austauschen (bspw. Textknoten), etc.

MfG ChrisB

[Daniel.S]

Grüße dich,

innerHTML funktioniert im Internet Explorers bei Tabellen- und select-Listen- sowie ein paar anderen Elementen erst ab Version 10 korrekt.