DHTML problemo

I have a problem with my dhtml on this page. Heres the code giving me the trouble:

Code:

---

function switchTo(toThis)
                        {
                                if (document.all)
                                {
                                        theDiv=document.all(toThis).style;
                                }
                                else if (document.GetElementById)
                                {
                                        theDiv=document.GetElementById(toThis).style;
                                }
                                theDiv.visibility="visible";
                                if (wasThis!="null")
                                {
                                        wasThis.visibility="hidden";
                                }
                                wasThis=theDiv;
                        }

---

all the variables have been declared globally, and the divs i pass as the argument have been created....i had this function working earlier, but it didn't hide the first div it was used on (eg: i used it once and it showed a div, then i used it again and it didn't hide the original like intended, just went one on top of the other. I used to split up into several functions, each hiding all other divs and displaying the specified, but it wasnt' as efficient so i tried to come up with a generic one and i've failed.
The error i recieve is "object required" so as far as i can tell this has to do with me doing: theDiv.visibility="visible"; or something like that, I think perhaps i'm not getting a hold of the object correctly. I'm pretty much in the dark on this one, which is something i'm not used to :). So thank's much to any help you can give.

Let me take a stab at this.


I'm almost positive the problem is that you are are treating a style as an object, when in reality a style is a property.

So do this:

function switchTo(toThis) {
if (document.all) {
theDiv=document.all(toThis);
} else if (document.GetElementById) {
theDiv=document.GetElementById(toThis);
}
theDiv.style.visibility="visible";
if (wasThis!="null") {
wasThis.visibility="hidden";
}
wasThis=theDiv;
}


Notice that theDiv is now an object, rather that the style of an object. You can now set the style.visibility of that object to "visible".

:D

You'll also have to do the same thing for "wasThis".

thanks for the help...that's what i tried originally and it didn't work...heres the code as it stands at this point:

Code:

---

function switchTo(toThis)
                        {
                                if (document.all)
                                {
                                        theDiv=document.all(toThis);
                                }
                                else if (document.GetElementById)
                                {
                                        theDiv=document.GetElementById(toThis);
                                }
                                theDiv.style.visibility="visible";
                                if (wasThis!="null")
                                {
                                        wasThis.style.visibility="hidden";
                                }
                                wasThis=theDiv;
                        }

---

tabs might be funky, but the code's there. i still have no clue whats up, i've always been able to do this, but not with this type of generic function (passing the div id as an argument). thanks again for any help you can give me.

There are a vartiety of things that should be checked since we don't dispose of your entire code.

1) forgive me, I am sure yopu don't need this point 1 advice, but I want to be complete and sure: you Do have to make sure the DIV you're addressing exists, has na ID= to the name you pass as an argument
say:
switchTo('AnId')
then you must have <div id="AnId" ecc...
and then the div must have the main style or class delcarations: postion (absolute or relative) and top and left and possibly visibility as well (better safe than sorry).

2) When you invoke
switchTo('AnId')
be sure it is between apex.

3)
theDiv=document.all(toThis);
That can cause problems: document.all, aunlike document.getElementById is NOT a function but a COLLECTION, so:
theDiv=document.all[toThis];/*SQUARE brackets*/

4) I suggest to change:
--------------------
if (wasThis!="null")
{
wasThis.style.visibility="hidden";
}
wasThis=theDiv;
--------------------
into:
--------------------
if (wasThis==null){/*NO apex: NULL is a keyword!*/
wasThis=theDiv;
}
wasThis.style.visibility="hidden";
------------------

This assumes you have a wasThis variable initialized earlier. I even can make a much better suggestion to you:
-----------------------
wasThis=theDiv;
wasThis.style.visibility="hidden";
-----------------------
that is, no conditional statements at all, and this would be bullet proof

If what your'e atrempting is to TOGGLE visibility (it is NOT clear), then:
------------------
wasThis=theDiv;
wasThis.style.visibility=(wasThis.style.visibility=="hidden")?
"visibile":"hidden";

Let us know what the GOAL was; it is essential.

ciao

TrueLies,

That was a very thorough and well thought out reply. I noticed that you are new to the forum. Could you please take a look at some of the threads I started that are still unresolved. They are definitely a challenge.

1. Preserving japanese characters with document.open()

2. LiveConnect with Netscape 6.2 & Netscape 7.0

3. Printing absolutely positioned content in IE5.5


Any insight to these is greatly appreciated.

Websmith99

thank you very much truelies,
i've worked all the bugs out. Basically i have links that run this function and they toggle the visibility of divs. Clicking one turns on the visibility of a div, while turning off the last one that was shown. They all start out hidden. Here's the code as it stands now (by the way i wasn't offended when you asked if i actually created the divs, i believe it had to do with me not putting single quotes around the div id when i passed it to the function...because i'm using IE6 so i would have never caught that document.all[] thing)

Code:

---

var theDiv;
var wasThis;
var toThis;
//...
                        function switchTo(toThis)
                        {
                                if (document.all)
                                {
                                        theDiv=document.all[toThis];
                                }
                                else if (document.GetElementById)
                                {
                                        theDiv=document.GetElementById(toThis);
                                }
                                if (theDiv!=wasThis) //if you didn't click on the same link twice...
                                {
                                        theDiv.style.visibility="visible";
                                        if (wasThis!=null)
                                        {
                                                wasThis.style.visibility=(wasThis.style.visibility=="hidden")?"visibile":"hidden";//since it already holds the variable for the last shown div, just toggle visibility
                                                wasThis=theDiv; //now since it's not null it won't go to the else statement...so make wasThis hold the last div id
                                        }
                                        else
                                        {
                                                wasThis=theDiv; //if wasThis is null, because the function has only been run once, then just assign it to what is currently theDiv...don't change it's visibility because you'll just turn off what you just turned on
                                        }
                                }
                        }

---

i had some other simple bugs like if the user clicked the same link twice it would not be able to retrieve the visibility property (because wasThis was already the same as theDiv and so on) so i threw in some catch all logic for that...it's pretty slick now, thanks again.