On Jan 23, 6:55 pm, "marss" <m...@ukr.netwrote:
Dautkha...@gmail.com wrote:
And tried to change visibility of a DIV, but this doesn't work.
How can I change visibility of set of TRs?Hi,
It is simple if you know which rows you want to hide/show.
Here is the example:
<html>
<head>
<script>
function changeVisibility(show)
{
var rows = document.getElementById("tbl").rows;
for(var i=0;i<rows.length;i++)
if (i==1 || i==2 || i==3)
rows[i].style.display = show ? "" : "none";}</script>
Consider the simplicity of a toggle:
function toggleDisplay(el) {
if (typeof el == 'string') el = document.getElementById(el);
el.style.display = ('none' == el.style.display)? '' : 'none';
}
</head>
<body>
<table id="tbl">
<tr><td>0</td></tr>
<tr><td>1</td></tr>
<tr><td>2</td></tr>
<tr><td>3</td></tr>
<tr><td>4</td></tr>
</table>
<input type="button" onclick="changeVisibility(true)" value="Show
Rows">
<input type="button" onclick="changeVisibility(false)" value="Hide
Rows">
That would be much simpler if the rows to hide/show were enclosed in
their own tbody element:
<table id="tbl">
<tr><th>0
<tbody id="tb01">
<tr><td>1<tr><td>2<tr><td>3<tr><td>4
</tbody>
</table>
<input type="button" onclick="toggleDisplay('tb01');"
value="Hide/show rows">
To prevent the "yo-yo" effect it may be better to toggle the visibility
instead.
--
Rob
