Dynamic table using user input. Please help!!

**Mar** · 09-21-2004, 10:20 PM

I am very new to JavaScript and I need to create a dynamic HTML table using the values entered by the user, this is for a Lab.
Here is what I have so far and it does not work. I truly do not know what I am doing. Any help would be greatly appreciated.

</head>
<body>

<script type="text/javascript">

var border=document.lab3form.border.value
var cellspacing= document.lab3form.cellspacing.value
var numbercells= document.lab3form.numbercells.value

function createTable() {
if (lab3form.border.value < 0 || lab3form.border.value > 5 ) {

alert ("Enter a border value between 0 and 5");
return 0;
}
else {var border = lab3form.border.value;
}
if (lab3form.cellspacing.value < 3 || lab3form.cellspacing.value > 10 ) {
alert ("Enter a cellspacing value between 3 and 10");
return 0;
}

else { var cellspacing = lab3form.cellspacing.value;
}
if (lab3form.numbercells.value > 99 || lab3form.numbercells.value < 0 ){
alert ("Number of table cells must be a positive number less than 100");
return 0;
}
else {var numbercells = lab3form.numbercells.value;
}
document.write ("<table align=\"center\"border=\"" + border + "\" cellspacing=\'' "+ cellspacing + "\">");
document.write ("<tr>");
for ( x=1; x <= cells; x++ ){
document.write ("<td>" + x + "</td>");
if (x % 3 == 0 ){
document.write ("</tr><tr>");
}
}
document.write ("</tr></table>");} //end function createTable ()

</script>
<form name="lab3form" onsubmit="return createTable(this)" name="lab3form" enctype="text/plain" >

<p>Please enter the following table attributes:</p>

<p>Border:<input type="text" size="1" name="border" /></p>

<p>Cellspacing:<input type="text" size="2" name="cellspacing" /></p>

<p>Number of Cells:<input type="text" size="3" name="numbercells" /></p>

<p> <input type="submit" value="Submit Info" name="Submit" /></p>
</form>
<table>

</table>

</body>
</html>

Thank you for anything you may be able to help me with.

**gigabites** · 09-22-2004, 12:01 AM

Code:

<script type="text/javascript">

var border=document.lab3form.border.value
var cellspacing= document.lab3form.cellspacing.value
var numbercells= document.lab3form.numbercells.value

function createTable() {
if (lab3form.border.value < 0 || lab3form.border.value > 5 )
{
	alert ("Enter a border value between 0 and 5");
	return 0;
}

else
	var border = lab3form.border.value;
	
if (lab3form.cellspacing.value < 3 || lab3form.cellspacing.value > 10 )
{
	alert ("Enter a cellspacing value between 3 and 10");
	return 0;
}

else
	var cellspacing = lab3form.cellspacing.value;
	
if (lab3form.numbercells.value > 99 || lab3form.numbercells.value < 0 )
{
	alert ("Number of table cells must be a positive number less than 100");
	return 0;
}
else
	var numbercells = lab3form.numbercells.value;

document.write ("<table align=\"center\" border=\"" + border + "\" cellspacing=\""+ cellspacing + "\">");
document.write ("<tr>");
for ( x=1; x <= numbercells;  x++ )
{
	document.write ("<td>" + x + "</td>");
	if (x % 3 == 0 )
		document.write ("</tr><tr>");
}

document.write ("</tr></table>");} //end function createTable ()

</script>

**Mar** · 09-23-2004, 02:02 PM

I found what was wrong, my var needs to be under the function.

Thanks anyway,

**gigabites** · 09-23-2004, 03:40 PM

Oh, Ok.. U're welcome

Thread: Dynamic table using user input. Please help!!

Thread Tools

Search Thread

Dynamic table using user input. Please help!!

Bookmarks

Bookmarks

Posting Permissions