...

View Full Version : Populating table dynamically problem



Anarchist
03-22-2005, 07:57 PM
I am trying to populate a table from a script but the output only populates the first three cells and places the 3 elements in one cell instead of 1 element per cell. What I am trying to do is write the array contents one element per cell until the end of the list.


// JavaScript Document

document.write("<table border='1'>\n");
document.write("<caption>");
document.write(caption);
document.write("</caption>\n");
document.write('<tr><th>');
document.write(firstcol);
document.write("</th>");
document.write('<th>');
document.write(secondcol);
document.write("</th>");
document.write('<th>');
document.write(thirdcol);
document.write("</th>");
document.write('<th>');
document.write(fourthcol);
document.write("</th>");
document.write('<th>');
document.write(fifthcol);
document.write("</th>");
document.write('<th>');
document.write(lastcoltitle);
document.write("</th>");
document.write("<tr>");
for (j=0;j<3;j++) {
document.write("<td align='right'>");
document.write(toys[j*1+j]);
document.write("</td>");
};
document.write("</tr>");

document.write("</table>");

Files are attached if anyone cares to help.

Cheers Anarchist

Anarchist
03-22-2005, 09:27 PM
I tried using this piece of code but the table is populated with all the elements in one row.


document.write("<tr>");
for (i=0;i<toys.length;++i) {
document.write("<td>");
document.write(toys[i]);
document.write("</td>");
};
document.write("</tr>");

vwphillips
03-22-2005, 10:18 PM
this may help



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>
<title></title>

<script language="JavaScript" type="text/javascript">
<!--

var Toys=new Array('1','2','3','4','5','6','7','8','9','10','11','12','13');
var cloneAry=new Array();
var cols=4
var rows,clone,obj,nu;

function Make(){
rows=Math.floor(Toys.length/cols)+1;
obj=document.getElementById('mytable').getElementsByTagName('TBODY')[0]
clone=obj.getElementsByTagName('TR')[1];
for (i=0;i<rows;i++){
cloneAry[i]=clone.cloneNode(true);
obj.appendChild(cloneAry[i]);
}
obj.removeChild(clone);
nu=0;
for (i1=0;i1<cloneAry.length;i1++){
tds=cloneAry[i1].getElementsByTagName('TD');
for (i2=0;i2<tds.length;i2++){
tds[i2].innerHTML='&nbsp;';
if (Toys[nu]){
tds[i2].innerHTML=Toys[nu];
nu++;
}
}
}
}
//-->
</script>

</head>

<body onload="Make();" >

<table border="1" id=mytable >
<tbody >
<tr>
<td>g</td>
<td>g</td>
<td>g</td>
<td>g</td>
</tr>
<tr>
<td width="25" ></td>
<td width="25" ></td>
<td width="25" ></td>
<td width="25" ></td>
</tr>
</tbody
</table>
</body>

</html>

Anarchist
03-22-2005, 10:34 PM
I'll try to adapt some of that into mine, if I can. This is what I have done so far as you can see I am still stuck on the data in the cells.

// JavaScript Document

document.write("<table border='1'>\n");
document.write("<caption>");
document.write(caption);
document.write("</caption>\n");
document.write('<tr><th>');
document.write(firstcol);
document.write("</th>");
document.write('<th>');
document.write(secondcol);
document.write("</th>");
document.write('<th>');
document.write(thirdcol);
document.write("</th>");
document.write('<th>');
document.write(fourthcol);
document.write("</th>");
document.write('<th>');
document.write(lastcoltitle);
document.write("</th>");
document.write("<tr>");

for (j=0;j<3;j++) {
document.write("<td align='right'>");
document.write(toys[j*3+j]);
document.write("</td>");
};
document.write("<td align='center'>");
document.write('<input type="text" name="quantity" size=20 value="">');
document.write("</td>");
document.write("<td align='center'>");
document.write('<input type="text" name="cost" size=20 value="">');
document.write("</td>");



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum