Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations bkrike on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Hiding tables by changing DIV attributes

Status
Not open for further replies.

Draug

Programmer
Apr 18, 2001
77
CA
Hi,

I have a series of tables that I can use javascript to hide. I can do that for each table as follows:
document.all.myTable.style.visibility = "hidden"

My question is, can I do the same with DIV's? It makes sense to me that you should be able to do that like follows: document.all.myDiv.style.visibility = "hidden" which would hide everything inside the DIV tags.

However, I have tried a number of times to get this to work and I can't. How do you change the visibility of the DIV along with everything inside the DIV?

Thanks for your help,
Draug
 
I have an idea of something that might work. I noticed, for me it was a problem at the time, that if you put a div or layer w/ an invisible background over another div or layer, then it hides all other divs or layers, but the main page can be seen. I would suggest using an event handler or something to change the z-index of the invisible div until you need it to hide the other stuff. If you need some help performing this, let me know. I'll be following this thread, & any help I can give, I'll glady offer.
Sincerely,
Daniel Leger
 
well you should call your div/layer like this:

Code:
<div id=&quot;myDiv&quot; style=&quot;position: absolute; left: 5; top: 5; background-color: #FFFFFF; layer-background-color: #FFFFFF; height: 357; width: 47; visibility: hidden&quot;> ect...

you put ns and ie commands in the style part, then us this code to do the right action

if (document.getElementById) {
document.getElementById('myDiv').style.visibility = 'hidden';
} else if (document.layers) { 
document.myDiv.visibility = 'hidden';
} else { 
document.all.myDiv.style.visibility = 'hidden';
}
use this to hide the div/layer then change the visibility to 'visible' to show the next table...i would put this in a function and pass what table you need to hide/show into it...start out with all of your tables hidden except for the one thats supposed to show, then hide and show on the fly -Greg :-Q
 
What is the advantage of using DIVs then? You see, currently I have four tables defined in the HTML. It goes something like this:

<table id=&quot;table1&quot; style=&quot;position:absolute; visibility=visible&quot;>
<table id=&quot;tabMenu&quot;>
<tr onClick=&quot;changeVisible(Tab1)&quot;>Tab1</tr>
<tr onClick=&quot;changeVisible(Tab2)&quot;>Tab2</tr>
<tr onClick=&quot;changeVisible(Tab3)&quot;>Tab3</tr>
<tr onClick=&quot;changeVisible(Tab4)&quot;>tab4</tr>
</table>
<table id=&quot;table1Data&quot;>
many rows of stuff
</table
</table>

There are 4 tables that look like the above table1. Table1 starts out visible, while the other three are hidden. Table1 is visible when tab1 is clicked, Table2 is visible when Tab2 is clicked, and so on. As one of the tabs are clicked on, the JS event handler changes the style.visibility property for table1, table2, table2, table4 so that only the table corresonding to the tab clicked on is visible. That all works fine.

The reason why I was asking about DIVs is because I thought my solution or changing the visibility on each of my 4 tables was very crude, sloppy, and generally unelegant. I was thinking that DIVs might allow me to perform my desired hiding/showing with better technique.

Any thoughts?
Thanks again for all of your input,
Draug
 
what do you mean by that...hidden/visible is how you hide/show, are you trying to accomplish movement or just hide/show..the advantage to div's are that ie and ns (to some extent) support them, ie doesn't support layers -Greg :-Q
 
Ya, I realized that DIV's were supported by both browsers, at least to some extent, and that NS does not support table id's. But, this is developed for an intranet which only runs IE, so it is not an issue really. I only need to make tables visible and hidden, not move them. As one table goes visible, the the previous one hides, and the new visible table replaces it in its location.

So, I am thinking that making the tables hidden/visible will be ok for me in this situation. What do you think?

Thanks,
Draug
 
yes that will work fine, just make sure you show on the fly cause the order might get screwed up if you stack them -Greg :-Q
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top