By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,543 Members | 2,169 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,543 IT Pros & Developers. It's quick & easy.

hi, <div style="visibility:hidden" id="hid"> is not working in table

P: 17
hi,
i am working on <div> i have to hide some part of the table. I am not able to hide that table part can anybady tell me where is the error.
Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3.  
  4.             <script type="text/javascript">
  5.              function callme(){
  6.                   document.getElementById("hid").style.visibility="visible";
  7.               }
  8.              function hideme(){
  9.                   document.getElementById("hid").style.visibility="hidden";    
  10.              }
  11.            </script>
  12.  
  13. </head>
  14. <body>
  15. <form name="myform">
  16.  
  17. <table width="100%"  border="4" cellpadding="2" cellspacing="2">
  18.         <tr>
  19.             <td  class="tableheader" colspan="9">TS </td>
  20.         </tr>
  21.      <div style="visibility:hidden" id="hid">
  22.         <tr>
  23.             <td width="17%" class="labeltext">Tran Code</td>
  24.             <td width="1%"  class="blanktext">:</td>
  25.             <td colspan="4" class="blanktext">Name</td>
  26.         </tr>
  27.         <tr>
  28.             <td width="17%" class="labeltext">Product Type</td>
  29.             <td width="1%"  class="blanktext">:</td>
  30.             <td colspan="4" class="blanktext">
  31.             </td>
  32.         </tr>
  33.      </div>
  34.         <tr>
  35.            <td>
  36.            </td>
  37.         </tr>
  38.  
  39. </table>
  40.  
  41. <input type="button" onclick="callme()" value="show">
  42. <input type="button" onclick="hideme()" value="hide">
  43.  
  44. </form>
  45. </body>
  46. </html>
  47.  
  48.  
  49.  
thx,
Ajay
Aug 22 '07 #1
Share this Question
Share on Google+
1 Reply


acoder
Expert Mod 15k+
P: 16,027
Tip: For your code tags, add =html or =javascript for the nice syntax colour-coding!

To solve this problem, get rid of the div and move the style and id attributes to the rows. Try this:
[HTML]<html>
<head>

<script type="text/javascript">
function callme(){
document.getElementById("hid").style.visibility="v isible";
document.getElementById("hid2").style.visibility=" visible";
}
function hideme(){
document.getElementById("hid").style.visibility="h idden";
document.getElementById("hid2").style.visibility=" hidden";
}
</script>

</head>
<body>
<form name="myform">

<table width="100%" border="4" cellpadding="2" cellspacing="2">
<tr>
<td class="tableheader" colspan="9">TS </td>
</tr>
<tr style="visibility:hidden" id="hid">
<td width="17%" class="labeltext">Tran Code</td>
<td width="1%" class="blanktext">:</td>
<td colspan="4" class="blanktext">Name</td>
</tr>
<tr style="visibility:hidden" id="hid2">
<td width="17%" class="labeltext">Product Type</td>
<td width="1%" class="blanktext">:</td>
<td colspan="4" class="blanktext">
</td>
</tr>
<tr>
<td>
</td>
</tr>

</table>

<input type="button" onclick="callme()" value="show">
<input type="button" onclick="hideme()" value="hide">

</form>
</body>
</html>
[/HTML]
Aug 22 '07 #2

Post your reply

Sign in to post your reply or Sign up for a free account.