Advanced Search

Show Hide table data

/ Published in: JavaScript
Save to your folder(s)
Show Hide table data uses href, anchors, div tags, and javascript to toggle between showing and hiding a table on the html page.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <script type="text/javascript">
  2. <!--
  3. function switchView(obj) {
  4. 	var el = document.getElementById(obj);
  5. 	if ( el.style.display != "none" ) {
  6. 		el.style.display = 'none';
  7. 	}
  8. 	else {
  9. 		el.style.display = '';
  10. 	}
  11. }
  12. //-->
  13. </script>
  14.  
  15.  
  16. <table>
  17. <tr>
  18.             <td width="30%" align="right" valign="top"><a href="##GotoMyControlName" onClick="switchView('MyControlName'); return false;">My Heading Text:</a></td>
  19.             <td width="1%">&nbsp;</td>
  20.             <td>
  21. <!-- BEGIN section of page that will toggle between show/hide by clicking link in cell above. -->
  22.                 <div id="MyControlName" style="display:none">
  23.                     <table border="0" cellpadding="3" cellspacing="0" >
  24.                     <tr >
  25.                     <td><span class="cPreReq">MyOUTPUTgoesHere</span>&nbsp;</td>
  26.                     </tr>
  27.                     </table>
  28.                 </div>
  29. <!-- END section of page that will toggle between show/hide -->
  30.             </td>
  31.           </tr>
  32.  
  33. </table>

URL: http://www.codekeep.net/JavaScript/code/snippets/20287/Show-Hide-table-data/view.aspx

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.