Flash Games - Internet Advertising - Debt Consolidation - Sport news - Herbal Supplements
PDA

View Full Version : Generate a table?

zk0
Feb 20th 2007, 12:18 pm
I know it's possible to generate a table. But how do you do? Can anyone guide me in the right direction to create a table like this one using javascript:

<table width="300" cellspacing="0">
<thead>
<tr>
<td>Titel 1</td>
<td>Titel 2</td>
<td>Titel 3</td>
</tr>
</thead>
<tr bgcolor="#CCCCCC">
<td>Name</td>
<td>info</td>
<td>Number</td>
</tr>
<tr>
<td>Name</td>
<td>info</td>
<td>Number</td>
</tr>
<tr bgcolor="#CCCCCC">
<td>Name</td>
<td>info</td>
<td>Number</td>
</tr>
</table>

What I have understood so far you need to use some kind of array? Please tell me if I am completely lost! :confused:
designcode
Feb 20th 2007, 12:31 pm
You want to generate a table with JS?

use
document.write('<table width="300" cellspacing="0">
<thead>
<tr>
<td>Titel 1</td>
<td>Titel 2</td>
<td>Titel 3</td>
</tr>
</thead>
<tr bgcolor="#CCCCCC">
<td>Name</td>
<td>info</td>
<td>Number</td>
</tr>
<tr>
<td>Name</td>
<td>info</td>
<td>Number</td>
</tr>
<tr bgcolor="#CCCCCC">
<td>Name</td>
<td>info</td>
<td>Number</td>
</tr>
</table>');
zk0
Feb 20th 2007, 1:50 pm
Thanks, but not like that.

Im more thinking of having some sort of array with a bunch of inormation, like the html code in my first post, that writes out the information sorted in an array.
rgchris
Feb 20th 2007, 2:01 pm
Look up multi-dimensional arrays. That'll probably point you in the right direction.
nico_swd
Feb 20th 2007, 2:32 pm
<body>
</body>

<script type="text/javascript">

var rows = new Array(
new Array('Title 1', 'Title 2', 'Title 3'),
new Array('name', 'info', 'number'),
new Array('name', 'info', 'number'),
new Array('name', 'info', 'number')
);


var table = document.createElement('table');
table.setAttribute('width', '300');

for (var i = 0; i < rows.length; i++)
{
var row = table.insertRow(0);

if (i % 2 != 0)
{
row.setAttribute('bgcolor', '#CCCCCC');
}

var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);

cell1.innerHTML = rows[i][0];
cell2.innerHTML = rows[i][1];
cell3.innerHTML = rows[i][2];

table.appendChild(row);
}

document.body.appendChild(table);


</script>
zk0
Feb 21st 2007, 2:45 am
Look up multi-dimensional arrays. That'll probably point you in the right direction.

Thank you. I think this is what I am looking for.


<body>
</body>

<script type="text/javascript">

var rows = new Array(
new Array('Title 1', 'Title 2', 'Title 3'),
new Array('name', 'info', 'number'),
new Array('name', 'info', 'number'),
new Array('name', 'info', 'number')
);


var table = document.createElement('table');
table.setAttribute('width', '300');

for (var i = 0; i < rows.length; i++)
{
var row = table.insertRow(0);

if (i % 2 != 0)
{
row.setAttribute('bgcolor', '#CCCCCC');
}

var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);

cell1.innerHTML = rows[i][0];
cell2.innerHTML = rows[i][1];
cell3.innerHTML = rows[i][2];

table.appendChild(row);
}

document.body.appendChild(table);


</script>


Wow, that was fast. But Im looking more for something like this:

Brady = new Array(3) for (i = 0; i < Brady.length; ++ i)
Brady [i] = new Array(3);

Brady [0] [0] = "Titel 1";
Brady [0] [1] = "Titel 2";
Brady [0] [2] = "Titel 3";
Brady [1] [0] = "Jan";
Brady [1] [1] = "Alice";
Brady [1] [2] = "Peter";
Brady [2] [0] = "Cindy";
Brady [2] [1] = "Mike";
Brady [2] [2] = "Bobby";

function print_2d_string_array(array)
{
document.writeln ("<table border>") ;
var row; for (row = 0; row < ;
array.length; ++row)
{
document.writeln (" <tr>");
var col for (col = 0; col < array
[row].length; ++col)
document.writeln (" <td>" + array
[row] [col] + "</td>");
document.writeln (" </tr>");
}
document.writeln ("</table>");
}


This code is what I got so far.

PROBLEMS:
I need to figure out how to make the titels be displayed as <th> tags.
And I need to display everything too.

:confused:

I am happy for any help I can get!
zk0
Feb 21st 2007, 12:59 pm
Okey Im getting there slowly:

cell = new Array (4); // Fyra rows
for (i = 0; i < cell . length; ++ i)
cell [i] = new Array (3); // Tre columns

cell[0][0] = "Title 1";
cell[0][1] = "Title 2";
cell[0][2] = "Title 3";
cell[1][0] = "Name";
cell[1][1] = "ID";
cell[1][2] = "Number";
cell[2][0] = "Name";
cell[2][1] = "ID";
cell[2][2] = "Number";
cell[3][0] = "Name";
cell[3][1] = "ID";
cell[3][2] = "Number";

function generateTable (array)
{
document.write("<table width=\"250\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">");
var row;

// th taggen

for (row = 0; row < array . length; ++ row)
{
document.write(" <tr>");
var col;
for (col = 0; col < array [row] . length; ++ col)
document.write(" <th bgcolor=\"#dddddd\">" + array [row] [col] + "</th>");
document.write(" </tr>");
}

/////////////////////////////////////////////////////

for (row = 1; row < array . length; ++ row)
{
document.write(" <tr>");
var col;
for (col = 0; col < array [row] . length; ++ col)
document.write(" <td bgcolor=\"#eeeeee\">" + array [row] [col] + "</td>");
document.write(" </tr>");
}
document.write("</table>");
}

generateTable (cell);


As you can see in the code I am trying to seperate the title array to be showned as a <th> tag. The rest should be displayed as <td> tags. But I havent yet figured out how... :confused:
zk0
Feb 22nd 2007, 4:20 am
This problem is solved. Thanks!