Weergeven van table in div icm HTML DOM

[Verwijderd]

Beste mensen,

Ik heb in een layer (div) een tabel opgebouwd met behulp van de HTML DOM (zie onderstaande code). Als ik de innerHTML opvraag van de div waarin de tabel zit, krijg ik netjes de HTML code te zien van de tabel. Allemaal goed dus zou je denken.
Vervolgens voeg ik de layer toe aan een andere layer (de container). Nu wordt alleen de tabel niet weergegeven? Als ik er geen tabel inzet maar gewoon tekst (handmatig met behulp van

code:

div.innerHTML = "tekst";

) dan gaat het wel allemaal goed en wordt de div wel weergegeven inclusief inhoud.

Ben ik vergeten een bepaalde style te zetten? Of iets anders?

code:

        var field = document.createElement("DIV");
        field.width=400;
        field.style.top = 100;
        field.style.left = 100;
        field.style.position = "absolute";
        field.id = 'test_layer';
        field.name = 'test_layer';
        
        var table = document.createElement("TABLE");
        table.style.display = "block";
        table.style.visibility = "visible";
        table.id='id_table';        
        var tr = document.createElement("TR");
        var td = document.createElement("TD");
        tr.style.display = "block";
        tr.id='id_tr';
        tr.style.visibility = "visible";
        td.style.visibility = "visible";
        td.style.display = "block";
        td.id='id_td';
        td.style.backgroundColor = "#eeeeee";
        td.innerHTML = "test";
        td.width = 250;
        tr.appendChild(td);
        tr.appendChild(td);
        tr.appendChild(td);
        table.appendChild(tr)
        
        field.style.visibility = "visible";
        field.style.display = "block";
        field.appendChild(table);
        
        var layer = document.getElementById(parent_layer);
        layer.appendChild(field);

[Verwijderd]

Oplossing gevonden:

het kan niet op de manier zoals je standaard HTML DOM elementen toevoegd (createElement, appendChild etc) maar op de volgende manier:

code:

        var table = document.createElement("TABLE");
    
        var oRow = table.insertRow();
        var links = oRow.insertCell();
        var rechts = oRow.insertCell();
        links.width = 200;

        links.innerHTML = "linkse cell";
        rechts.innerHTML = "rechtse cell";

* 6-Pack is dol op monologen op GoT *

[BetuweKees]

.innerHTML is geloof ik IE only, dus ga er maar even vanuit dat je in IE geprobeerd hebt. Uit eigen ervaring weet ik dat IE dynamisch aangemaakte objecten op een of andere manier niet in zijn document structuur opneemt (bv in form element verdubbelen (clonen), id nieuwe element wijzigen zodat het uniek blijft, en vervolgens waarde van nieuwe form element uitvragen geeft een foutmelding)

heb je al geprobeerd of je er in MOZ wel uitkomt? (dan moet je geloof ik wel .textNode() gebruiken, kut dat ik niet thuis zit, anders had ik even in me voorraad scriptjes gekeken voor je)

edit:

moet sneller leren tikken

[ Voor 5% gewijzigd door BetuweKees op 10-12-2003 15:19 ]

[crisp]

innerHTML is geen onderdeel van de DOM, maar is wel in de meeste moderne browsers geimplementeerd.
In IE kan je inderdaad dmv createElement en appendChild geen table opbouwen; echter kan dat wel in echte browsers zoals Mozilla. Echter als je meerdere keren hetzelfde element wilt appenden zul je 'm moeten clonen.
Als je echt puur volgens DOM wilt werken moet het zoiets worden:

JavaScript:

  var field = document.createElement('DIV');
  field.style.width = '400px';
  field.style.top = '100px';
  field.style.left = '100px';
  field.style.position = 'absolute';

  var table = document.createElement('TABLE');
  var tr = document.createElement('TR');
  var td = document.createElement('TD');
  var text = document.createTextNode('test');
  td.style.backgroundColor = '#eeeeee';
  td.style.width = '250px';
  td.appendChild(text);
  tr.appendChild(td);
  tr.appendChild(td.cloneNode(true));
  tr.appendChild(td.cloneNode(true));
  table.appendChild(tr);
       
  field.appendChild(table);
       
  document.body.appendChild(field);

[4of9]

crisp schreef op 10 december 2003 @ 15:37:

In IE kan je inderdaad dmv createElement en appendChild geen table opbouwen; echter kan dat wel in echte browsers zoals Mozilla.

zeg niet dat ik het er wel of niet mee eens ben hoor maar dacht dat dit soort uitspraken nooit gewaardeerd werden?

[crisp]

4of9 schreef op 10 december 2003 @ 15:49:
[...]


zeg niet dat ik het er wel of niet mee eens ben hoor maar dacht dat dit soort uitspraken nooit gewaardeerd werden?

hoezo? ik beargumenteer het zelfs in dezelfde zin. Mijn definitie van een 'echte browser' is een browser die onder andere minstens DOM level 2 compliant is, IE valt daar duidelijk niet onder

[mr.inno]

crisp schreef op 10 december 2003 @ 15:59:
[...]

hoezo? ik beargumenteer het zelfs in dezelfde zin. Mijn definitie van een 'echte browser' is een browser die onder andere minstens DOM level 2 compliant is, IE valt daar duidelijk niet onder

smart one..
innerhtml word idd door veel brousers onder stuend.
en werkt normaal goed.

[crisp]

ot: Leuke IE bug