[JS/DHTML?] Table maken uit for lus.

[semicon]

Hallo,

Op het volgende probleem weet ik even geen oplossing te vinden, maar meen toch crisp ooit erover gesproken te zien hebben... kan het nog niet terugvinden in de search, dus dan mijn vraag.

Je kan met DHTML(? d8 ik) soort on-the-fly tables aanmaken. met een soort blablaMode.add(table) commando.

Het zit namelijk zo, nu doe ik nog dit:

code:

document.write("<table>");
for(x=0;x>gotarray.length;x++) {
          document.write('<tr><td>');
          // een wilekeurige arraywaarde hier
          document.write('</td><td>');
          // NO Geen wilekeurige arraywaarde hier
          document.write('</td></tr>');
}
// volgens mij snappen jullie wat ik bedoel nu :-P

Er staat me dus iets bij dat ik netjes zoiets kan doen
( LET OP, dit iets is verzonnen, zoek dus het juiste )

code:

newNode.add('table');
newNode.apply;
for(x=0;x>gotarray.length;x++) {
        newNode.add(tr);
       ... enz

Iemand die de verlossing biedt?

[dominic]

code:

var oTABLE = document.createElement("TABLE");
var oTD = document.createElement("TD");
var oTR = document.createElement("TR");

oTR.appendChild(oTD);
oTABLE.appendChild(oTR);

Dit moet je wel een eindje op weg helpen..

[ Voor 23% gewijzigd door dominic op 29-08-2004 23:28 ]

[semicon]

Inderdaad, nog zo dat ik een tabel kan maken, want ik snap de logica nog niet, dat soort dingen moet je een keer gezien hebben voor je ze snapt..

zo snap ik nu niet hoezo alles in een var gaat en dan een appendchild?


EDIT:
ik bedoel meer zoiets van td /td als ik alleen dat al weet, denk ik dat ik er zelf wel raad mee weet, maar het kwartje wil nog niet vallen

Ik ben ondertussen wel op google bezig, maar als iemand het kan uitleggen zou het altijd welkom zijn

[ Voor 20% gewijzigd door semicon op 29-08-2004 23:37 ]

[Grijze Vos]

appendChild voegt een node toe die het kind is van de huidige node. Je moet eerst die child aanmaken, alvorens je hem kunt toevoegen uiteraard.

[dominic]

je maakt dmv createElement een object aan, de 'var' statement is simpelweg nodig om de variabele te declareren.

oTD, oTR en oTABLE zijn dus objecten, resp een <TD> een <TR> en een <TABLE>, je kunt hier dus properties aan toekennen, bijvoorbeeld oTD.innerText = "fuck de duck"; maar ook methods als: var newTD = oTD.cloneNode(true);

Toch maar verder googlen, probeer er wat meer over te leren.. Kant en klare voorbeelden zul je hier niet vinden, maar bijvoorbeeld op http://www.dynamicdrive.com wel..

[semicon]

overigens, het is dan dus geen DHTML, maar DOM?

ik denk dat het een beetje begint te dagen, heb al een aantal voorbeelden gevonden, nu moet ik het alleen nog zelf laten werken

[dominic]

semicon schreef op 29 augustus 2004 @ 23:40:
overigens, het is dan dus geen DHTML, maar DOM?

ik denk dat het een beetje begint te dagen, heb al een aantal voorbeelden gevonden, nu moet ik het alleen nog zelf laten werken

DHTML staat voor Dynamic HTML, dus HTML voorzien van een scriptje..
DOM is een objectmodel, nl. het document object model; een hierarchische structuur van alle objecten binnen een document..

[semicon]

Gaaf... thx voor de uitleg.

Maar, al d8 ik het bijna te hebben werkt het volgende niet waarom dat weet ik dus niet.

code:

var table = document.createElement("table");
table.setAttribute("border", "1");

var tr = document.createElement("tr"); 
var td = document.createElement("td");

td.appendChild(document.createTextNode("test rij1"));
tr.appendChild(td);

td = document.createElement("td");
td.appendChild(document.createTextNode("test rij2"));
tr.appendChild(td);

table.appendChild(tr);
document.body.appendChild(table);

volgens mij moet het dan zo toch, ik krijg in IE dat de pagina dan niet geopend kan worden ?

[Clay]

in IE werkt createElement niet zo lekker met tables. Wat je beter gebruiken kan is [thead/tfoot/tbody].insertRow(index), en [row].insertCell(index).