[JS] [TABLE] Rijen en cellen maken; FF: ok; IE: onzichtbaar?

[netiul]

Onderstaande functie voegt rijen met cellen toe aan een tabel. Hij doet het ook, zowel in FireFox als in IE. Echter in IE zijn ze niet zichtbaar? Dat ze wel aangemaak wordt gecontroleerd op de laatste regels van deze functie. Daar wordt het aantal cellen ge-alert() van de 1e rij.

JavaScript:

        telrijen = document.all['mainTable'].getElementsByTagName("TR").length;
        telcellen = document.all['mainTable'].getElementsByTagName("TR")[0].getElementsByTagName("TD").length;
        alert('Rijen: ' + telrijen + ' / Cellen: ' + telcellen);

Zowel in FF als in IE wordt hetzelfde aantal cellen ge-alert(). JS ziet de rijen dus wel, maar IE toont ze niet?

JavaScript:

    function addrow(firsttime) {
        if(firsttime) {
            rowstoadd = defrows;
            cellstoadd = defcells;
            oRow = document.createElement("TR");
            oCell = document.createElement("TD");
            oRow.appendChild(oCell);
            oCell = document.createElement("TD");
            oCell.innerHTML = "Naam";
            oRow.appendChild(oCell);
            for(i=0;i<cellstoadd;i++) {
                oCell = document.createElement("TD");
                welkeCell = "<span style='color:green'>0</span>";
                oCell.innerHTML = welkeCell;
                oRow.appendChild(oCell);
            }
            document.all['mainTable'].appendChild(oRow);
        } else {
            rowstoadd = 1;
            eersterij = geefeersterij();
            if(!eersterij) cellstoadd = 1;
            else cellstoadd = eersterij.getElementsByTagName("TD").length - 2;
        }
        for(j=0;j<rowstoadd;j++) {
            oRow = document.createElement("TR");
            oCell = document.createElement("TD");
            oCell.innerHTML = "<span>0</span>";
            oRow.appendChild(oCell);
            oCell = document.createElement("TD");
            oCell.innerHTML = welkeRow;
            oRow.appendChild(oCell);
            //oRow.id = welkIdRow;
            aantalrijen = document.all['mainTable'].getElementsByTagName("TR").length;
            for(i=0;i<cellstoadd;i++) {
                oCell = document.createElement("TD");
                welkeCell = "<input type='text' size='3' onblur='recalc("+(i+2)+","+aantalrijen+")' />";
                oCell.innerHTML = welkeCell;
                //oCell.id = welkIdCell;
                oRow.appendChild(oCell);
            }
            document.all['mainTable'].appendChild(oRow);
        }
        telrijen = document.all['mainTable'].getElementsByTagName("TR").length;
        telcellen = document.all['mainTable'].getElementsByTagName("TR")[0].getElementsByTagName("TD").length;
        alert('Rijen: ' + telrijen + ' / Cellen: ' + telcellen);
    }

IE's debugger geeft ook geen fouten aan oid.
De complete versie is hier te zien (dus alleen zichtbaar in FF).

[ Voor 54% gewijzigd door netiul op 10-08-2005 13:53 . Reden: scriptje iets aangepast ]

[SuperRembo]

Je voorbeeld staat op localhost

[netiul]

verkeerde URL gekopieerd, nu wel: http://www.solcon.nl/luiten/maaltijden/

[Verwijderd]

zet voordat je alle acties doet eens display op none en daarna weer op block (van de hele table), volgens mij was dat een renderbugje in IE

[semicolon]

In Safari werkt je voorbeeld ook niet, maar zodra ik document.all['mainTable'] verander in document.getElementById('mainTable') werkt hij hier wel. Misschien in IE ook?

[netiul]

Hm, helaas werkt het veranderen van de display niet en het vanderen van document.all['mainTable'] in document.getElementById('mainTable') ook niet.

[crisp]

In de DOM heeft een TABLE-element ook nog een TBODY-element; je moet geen rijen appenden aan je table, maar aan je tbody

En vervang in hemelsnaam dat document.all (wie gebruikt er nog IE4 ?) ook door de DOM-method getElementById...