Dojo : show() and hide() .... HOW?

Question

I have a container element in which I create on the fly/place() a form, then another one..etc. My goal is to switch between them i.e. hide all and show only the active form. It hides alright, but I can't show the active back.

I tried using:

1. .style.display(none<->block) and visibility(visibility<->hidden)
2. dojo.style(...)
3. resize() and startup() after the changes
4. Several other variants i found on Internet from old dojo's

Nothing works. /I need it to work with display, so that it does not occupy space./

Can you tell me what is the correct way to show and hide with dojo()

Also looked at this one : How do I dynamically show and hide an entire TabContainer using DOJO?

Does not work.

The pseudo code I use is something like this : ....

//find or create the FORM element
form =  dijit.byId(...);
if(typeof form != 'object') {
  form = dojo.create('form', ....);
  dojo.place(form,'containerx','last');
}
//hide all
dojo.query('#containerx > *').forEach(function(item){
  dojo.style(item, 'visibility','hidden');// and all other variants i mentioned
})
//show only the current form
dojo.style(form, 'visibility','visible');
//if the dojo form obj was already created, then skip it
if (this.form_obj) return;

....build the form and the elements....

this.form_obj.startup()

thanx

Answer 1

Sounds like you might be looking for StackContainer functionality.

Just set things up so that the StackContainer has the dijit.form.Forms as children and you can use the selectChild method to choose what form to display.

Answer 2

I just answered the question in that thread you referenced in your question a few minutes ago. Basically it involved getting jQuery involved. Works great for me. I have all the tabs created statically (as opposed to programatically) and I'm able to manipulate whether they are shown or hidden with the help on jQuery. All the code any everything is in my post here:

How do I dynamically show and hide an entire TabContainer using DOJO?