createElement for TD won't colspan properly 2

vb6novice · Aug 25, 2004

My page has a table with a single row with 7 cells for a calendar. I'm trying to add a row with js which will span the 7 cells using createElement. Here's the code:

Code:

var row = document.createElement("TR")
	with(row.style){
	backgroundColor = "#FFFFFF"; 
	}
var tdmoyr = document.createElement("TD")
	with(tdmoyr.style){
	height = 40;
	width = 85;
	colspan = 7;
	}
	tdmoyr.innerHTML = "<height='40' colspan='7' align='center' valign='middle'><p class='homehdrtext'><b>" + month_year +"</b></p>"
row.appendChild(tdmoyr);
tbody.appendChild(row);

The text for the variable month_year always ends up in the first column, and the other 6 columns are spanned.

What am I doing wrong?

All help is appreciated.

Lrnmore · Aug 25, 2004

vb6novice,

Setting colspan is case sensitive in javascript, you can
do it like this:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
  <title>ColSpan</title>
<script>
function mkRow(){
var tbody = document.getElementById('Tab').getElementsByTagName('TBODY')[0];
var row = document.createElement("TR")
var tdmoyr = document.createElement("TD")
tdmoyr.colSpan = 3;
tdmoyr.height = 40;
tdmoyr.bgColor = 'blue';
    tdmoyr.innerHTML = "<p class='homehdrtext'><b>TEST</b></p>"
row.appendChild(tdmoyr);
tbody.appendChild(row);
}
</script> 
</head>
<body>
<table id='Tab'>
<tbody>
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
</tbody>
</table>
<input type="button" value="AddRow" onClick="mkRow()">
</body>
</html>

HTH

Great Javascript Resource:

http://devedge.netscape.com/library/manuals/2000/javascript/1.5/guide/

BillyRayPreachersSon · Aug 26, 2004

I think the original problem was that vb6novice was trying to set colspan as part of the style, rather than on the object itself.

To avoid any case-sensitivity issues, use "setAttribute", and include an extra (non-standard) 3rd parameter (only needed for IE, incidentally - it works fine in FireFox without it) that tells it to ignore case:

Code:

tdmoyr.setAttribute('colspan', '3', 0);

Hope this helps,
Dan

vb6novice · Aug 26, 2004

Thanks to both Lrnmore and Dan. Both methods work well.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

createElement for TD won't colspan properly 2

vb6novice

Programmer

Lrnmore

Technical User

BillyRayPreachersSon

Programmer

vb6novice

Programmer

Similar threads

Part and Inventory Search

Sponsor