function help

@transam00Nov 19.2009

[CODE] function closeall() { var divs=document.getElementsById(‘div’) for(var i=0; i<divs.length; i++) divs[i].style.display=’none’; } [/CODE]

This function hides all the divs on the page. I am actually trying to hide a table, just one table with the id of “control”.
I have tried just about everything, I think. Can anyone help?

to post a comment

JavaScript

6 Comments(s) _↴

@JMRKERNov 19.2009 — #If you know the ID of the table element, why not just take the easy way to success?

<i>
 </i>&lt;html&gt;
 &lt;head&gt;
 &lt;script type="text/javascript"&gt;
 // From: http://www.webdeveloper.com/forum/showthread.php?t=220183
 
 function hideTable(flag) {
 if (flag) {
 document.getElementById('control').style.display = 'none';
 } else {
 document.getElementById('control').style.display = 'block';
 } 
 }
 &lt;/script&gt;
 
 &lt;/head&gt;
 &lt;body&gt;
 &lt;button onclick="hideTable(true)"&gt;Hide Table&lt;/button&gt;
 &lt;button onclick="hideTable(false)"&gt;Show Table&lt;/button&gt;
 &lt;p&gt;
 &lt;table id="control"&gt;
 &lt;tr&gt;
 &lt;td&gt;1&lt;/td&gt;
 &lt;td&gt;2&lt;/td&gt;
 &lt;td&gt;3&lt;/td&gt;
 &lt;/tr&gt;
 &lt;tr&gt;
 &lt;td&gt;4&lt;/td&gt;
 &lt;td&gt;5&lt;/td&gt;
 &lt;td&gt;6&lt;/td&gt;
 &lt;/tr&gt;
 &lt;tr&gt;
 &lt;td&gt;7&lt;/td&gt;
 &lt;td&gt;8&lt;/td&gt;
 &lt;td&gt;9&lt;/td&gt;
 &lt;/tr&gt;
 &lt;/table&gt;
 &lt;/body&gt;
 &lt;/html&gt;

If there is a requirement to check all the DIV tags for the one containing the table,

I think you wan to use divs = getElementsByTagName('div') because I don't think

there is a function called 'getElement[COLOR="Red"]s[/COLOR]ById'

@transam00authorNov 19.2009 — #This kinda intersects with a previous post that I had. I also have this function

[CODE]
 function clicked(element)
 {
 var div=document.getElementById(element)
 if(div.style.display=='none')
 div.style.display='block';
 else
 div.style.display='none';
 return;
 }
 Which is used for my tree menu, basically, I'm just looking to have the tree menu all closed up on page load. So I was using this....
 [CODE]
 function closeall()
 {
 var divs=document.getElementsById('control')
 for(var i=0; i<divs.length; i++)
 divs[i].style.display='none';
 }
 [/CODE]

The only problem is that I have a whole lot of other divs that get hidden as well when I use that. So what I was trying was to just have to table hidden on load. But something is telling me that just hiding the table won't work correctly with my onclick function for the tree menu that I have. I hope someone can understand that. Also, I'm just starting to learn javascript, so that makes a little tougher for me.

@JMRKERNov 19.2009 — #Post a sample of the tree menu that you are trying to modify.

Just 2 or 3 of the entries with HTML and JS code

so we can see what you are trying to accomplish.

@transam00authorNov 19.2009 — #Ok, here we go...Found these online.

[CODE]
 <script type="text/javascript">
 function closeall()
 {
 var divs=document.getElementsByTagName('div')
 for(var i=0; i<divs.length; i++)
 divs[i].style.display='none';
 }
 
 function clicked(element)
 {
 var div=document.getElementById(element)
 if(div.style.display=='none')
 div.style.display='block';
 else
 div.style.display='none';
 return;
 }
 window.onload=closeall();
 </script>
 [/CODE]

Here is my tree menu,

[CODE]
 <table width="705" border="0" cellspacing="0" bgcolor="#D3E0EC">';
 echo '<tr>';
 echo '<li>';
 echo '<td width="323">';
 echo '<a href="#" class="style10" onclick="clicked('' . $row['item_name'] . '')">' . $row['item_name'] . '</a>';
 echo '</td>';
 echo '<td width="100"><div align="center"><form id="form3" name="form3" method="post" action="delete.php">';
 echo '<input type="submit" name="submit" class="style10" style="cursor: pointer; border: 0; background-color: #D3E0EC;" id="submit" value="X" /></form></div></td>';
 echo '<td width="75"><div align="center" class="style10">55</div></td>';
 echo '<td width="131"><div align="center" class="style10">07-19-2009</div></td>';
 echo '</tr>';
 echo '</table>';
 echo '</li>';
 echo '<div id="' . $row['item_name'] . '">';
 echo '<ul class="NoBullet">';
 echo '<li>';
 echo '<table width="700" border="0" cellspacing="0" bgcolor="#454545">';
 echo '<tr>';
 echo '<td width="125"><div align="center"><strong><span class="style2">';
 echo '<img src="' . $row['thumb_1'] . '" width="100" alt="" />';
 echo '</span></strong></div></td>';
 echo '<td width="580"><strong><span class="style2">';
 echo '&nbsp; Description: <br /><br /> &nbsp; <textarea name="description" cols="70" rows="4" color="white" style=" font-weight: bold; overflow: hidden; color: white; border: none; background-color:#454545;">' . $row['description'] . '</textarea>';
 echo '</span></strong></td>';
 echo '</tr>';
 echo '<tr>';
 echo '<td colspan="2"><table width="705" border="0">';
 echo '<tr>';
 echo '<td width="125"><div align="center"><strong><span class="style2">';
 echo '';
 echo '</span></strong></div></td>';
 echo '<td width="580"><span class="style1">';
 echo '&nbsp; Seeking: <br /><br /> &nbsp; <textarea name="in_return" cols="70" rows="3" border="0"  style="font-weight: bold; color: white; overflow: hidden; border: none; background-color:#454545;">' . $row['in_return'] . '</textarea>';
 echo '</span></td>';
 echo '</tr>';
 echo '</table></td>';
 echo '</tr>';
 echo '<tr>';
 echo '<td colspan="2"><table width="705" height="112" border="0">';
 echo '<tr>';
 
 And so on,,,,,,,,,
 [/CODE]

My tree menu is populated from my database (pics and text)

Oh yeh, my tables get echoed out as you can see.

@KorNov 19.2009 — #in standard CSS and HTML (that means except for IE :rolleyes: ) , the "positive" display for tables and tables' elements is not "block", as those elements are not block-level elements. Anyway you may use successfully and crossbrowser a simply empty value:

<i>
 </i>if(div.style.display=='none')
 [COLOR="Blue"]div.style.display='';[/COLOR]

@transam00authorNov 19.2009 — #Uh, ok. But back to having one div or table closed upon page load. Is that what you were talking about?

Also in #JavaScript _↴

Javascript to detect Java Edit textarea Something like apple.com

Success!

Help @transam00 spread the word by sharing this article on Twitter...

Tweet This

function help

6 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

function help

6 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

6 Comments(s) _↴

Also in #JavaScript _↴