CC Ricers
27 Sep 2005, 01:33 PM
I have a table with alternating hidden and permanently visible rows. When the user clicks a link on a permanently visible row, it toggles a hidden row to display and hide, which expands and contracts the table.
This is the javascript I used to make it work in Firefox:
<script type="text/javascript">
<!--
function switchMenu(obj)
{
var el = document.getElementById(obj);
if(el.style.display != "table-row") {
el.style.display = "table-row"; } else {
el.style.display = "none";
}
}
// -->
</script>
// Link to expand the table
<a href="#" onclick="switchMenu('new_row');">Click</a>
// Invisible row
<tr id="new_row" style="display: none;"><td> . . . </td></tr>
This doesn't work in IE 6, however, because I get an error about an invalid argument. I guess "table-row" is not supported by the browser as a CSS argument. How do I get around this problem?
This is the javascript I used to make it work in Firefox:
<script type="text/javascript">
<!--
function switchMenu(obj)
{
var el = document.getElementById(obj);
if(el.style.display != "table-row") {
el.style.display = "table-row"; } else {
el.style.display = "none";
}
}
// -->
</script>
// Link to expand the table
<a href="#" onclick="switchMenu('new_row');">Click</a>
// Invisible row
<tr id="new_row" style="display: none;"><td> . . . </td></tr>
This doesn't work in IE 6, however, because I get an error about an invalid argument. I guess "table-row" is not supported by the browser as a CSS argument. How do I get around this problem?