Welcome to WebmasterWorld Guest from 54.160.187.160

Forum Moderators: open

Message Too Old, No Replies

Know how to make tables inside javascript?

getting frustrated!

     
2:14 am on Jun 1, 2003 (gmt 0)

Full Member

10+ Year Member

joined:Sept 7, 2001
posts:212
votes: 0


Hi guys - I've got an online quiz that is all javascript - basically the html page just references the script, which is contained on a .js page. I want to split the quiz into 2 columns - and have found it impossible! Obviously javascript is more for doing functions and not design - but in this case I can't split the script into 2 in order to make 2 columns - and I have not been able to find a way to add a simple 2 column table inside of the javascript (it's a quiz w/ 8 questions, each w/ its own image).

I tried inserting the script itself into the html page and dividing up the script into a table - but that didn't work. Seems I need to actually program the table itself in the javascript language and not html. Anybody have a clue how I could do this?

thanks!

4:18 am on June 1, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member jdmorgan is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Mar 31, 2002
posts:25430
votes: 0


Stace,

I may be misunderstanding your question entirely, and I'm certainly no JavaScript wiz, but here is a simple example...

Two rows of two columns, each including a variable to be displayed:


<script language="JavaScript" type="text/JavaScript">

var row1col1var = 'blue';
var row1col2var = 'widgets';
var row2col1var = 'green';
var row2col2var = 'widget';

document.write('<center><table width="75%" border="1">');
document.write('<tr align="center"><td>' + row1col1var + '</td><td>' + row1col2var + '</td></tr>');
document.write('<tr align="center"><td>' + row2col1var + '</td><td>' + row2col2var + '</td></tr>');
document.write('</table></center>');
</script>

Jim

4:24 am on June 1, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member mivox is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Dec 6, 2000
posts:3928
votes: 0


I moved this thread over here to the HTML forum... you'll find a lot more help with coding here than you would in the Graphics forum. :)
5:47 am on June 1, 2003 (gmt 0)

Preferred Member

10+ Year Member

joined:Dec 29, 2002
posts:533
votes: 0


I'm just curious as to why you are trying to write the table with javascript. Is it like a random question thing? Or is the point of this script to just check if the answers are right? If you post what the point of doing this is maybe we can help you think of a better way of doing it.
6:45 am on June 1, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member g1smd is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:July 3, 2002
posts:18903
votes: 0


You'll need to escape the closing tags in javascript document.write statements, so a small change:

<script language="JavaScript" type="text/JavaScript">

var row1col1var = 'blue';
var row1col2var = 'widgets';
var row2col1var = 'green';
var row2col2var = 'widget';

document.write('<center><table width="75%" border="1">');
document.write('<tr align="center"><td>' + row1col1var + '<\/td><td>' + row1col2var + '<\/td><\/tr>');
document.write('<tr align="center"><td>' + row2col1var + '<\/td><td>' + row2col2var + '<\/td><\/tr>');
document.write('<\/table><\/center>');
</script>

Apart from that minor omission, a good answer, and the one that I would have given.

1:03 am on June 2, 2003 (gmt 0)

Full Member

10+ Year Member

joined:Sept 7, 2001
posts:212
votes: 0


Hi guys- actually it is a quiz program that is already in javascript - it gives the user several answers, then allows them to evaluate how they've done. The reason I wanted a table was because with 8 images it looks a lot better to have them in 2 columns rather than just 1 long page.

I did manage to figure it out though! I just had to adapt regular a html table to the javascript format - ended up looking like this - at the beginning of the quiz I added this:

"<table border=0 cellpadding=0 cellspacing=0 width='100%' bgcolor='#C0C0C0'><tr><td><td width='100%'>Question 1",

then at the end of the line of script that I wanted to be the last question/image contained in column 1, I added

</td><td>

after the last question and image, a new line:

"</td></tr></table>",

worked great!