Here is the problem: I have a table similar to -
<table>
<colgroup>
<col class="CSS1">
<col class="CSS2">
</colgroup>
<tbody>
<tr>
<td>Col 1</td>
<td>Col 2</td>
</tr>
</tbody>
</table>
When the page loads, the CSS styles are correctly applied
to the columns in the table. I also have some javascript
on the page that causes the "CSS2" to become "CSS3" at
runtime using JavaScript/DHTML via:
eColElement2.className = "CSS3";
The new CSS properties are not applied to the column.
Is this the intended behavior? Does the 'class' attribute
of the 'col' element serve only as some sort of default?
How can I achieve this transformation without looping
over every cell in the whole table?
BTW: My browser is IE6.01.
Regards,
Richard Hauer.
MSDN Universal Subscriber.
Ariel Molina - 30 Jul 2003 20:40 GMT
Richard,
I took the time to try to reproduce the behavior you reported but did not
see the problem. In other words I can dynamically change a col object's
class attribute using javascript. Perhaps the problem lies in what sort of
styles the class definitions specify. If your reply with a link to a repro
page I would be glad to take a look at it for you. Here is what is working
for me:
<html>
<HEAD>
<script>
function test()
{
document.all.col1.className = "redText";
document.all.col2.className = "blueText";
}
</script>
<STYLE TYPE="text/css">
.redText {color: red;}
.blueText {color: blue;}
</STYLE>
</HEAD>
<BODY>
<table ID="Table1">
<colgroup>
<col id="col1" class="blueText">
<col id="col2" class="redText">
</colgroup>
<tbody>
<tr>
<td>Col 1</td>
<td>Col 2</td>
</tr>
</tbody>
</table>
<input type=button value="Switch column classes" onclick=test()>
</BODY>
</html>
Microsoft Online Support
Ariel Molina