To hide/show area of web page without re-loading a page | |||
| |||
<script language="text/javascript"> function ExpandCollapseTable(titleRow) { if(titleRow.parentNode.childNodes.length > 1) { if(titleRow.parentNode.childNodes[1].style.display=="block" || titleRow.parentNode.childNodes[1].style.display=="") { for(var i=1;i<titleRow.parentNode.childNodes.length;i++) { titleRow.parentNode.childNodes[i].style.display = "none"; } } else { for(var i=1;i<titleRow.parentNode.childNodes.length;i++) { titleRow.parentNode.childNodes[i].style.display = "block"; } } } } </script> Following is HTML body calling above function. <body> <table border=1> <tr onclick="ExpandCollapseTable(this);" style="cursor:pointer;"> <td colspan=3> Table Header(click to expand-collapse) </td> </tr> <tr> <td style="width: 100px">1</td> <td style="width: 100px">2</td> <td style="width: 100px">3</td> </tr> <tr> <td style="width: 100px">4</td> <td style="width: 100px">5</td> <td style="width: 100px">6</td> </tr> <tr> <td style="width: 100px">7</td> <td style="width: 100px">8</td> <td style="width: 100px">9</td> </tr> </table> </body> Tags: Bitmap Image Loading Compare Table HTML Javascript RowExists Style Tag style.display | |||
| |||
| |||
Login for comment |