Attivazione/disattivazione della visualizzazione di un Dojo dijit

Question

Sto tentando di implementare un semplice show/hide di un div dijit in Dojo. Sulla base di altri framework javascript con cui ho lavorato, questo dovrebbe essere facile, ma nel complesso mi è sembrato difficile.

Ecco il codice dal

<script type="text/javascript"> 
dojo.require("dijit.form.Button"); 
dojo.require("dijit.layout.ContentPane"); 
dojo.require("dojo.fx"); 
var toggler = null; 
function basicToggle() { 
    toggler = new dojo.fx.Toggler({ 
     node: "panel", 
     showFunc : dojo.fx.wipeIn, 
     hideFunc : dojo.fx.wipeOut 
    }) 
} 
dojo.addOnLoad(basicToggle); 
</script> 

Di seguito è riportato il mio codice nel corpo.

<button dojoType="dijit.form.Button">  
    <img src="wrapper/images/header-settings.png" border="0" />  
    <script type="dojo/method" event="onClick"> 
     toggler[dijit.byId("panel").attr("displayed") ? 'show':'hide'](); 
    </script> 
</button> 
<div id="panel" dojoType="dijit.layout.ContentPane" style="border: .2em dotted  #900;display: none"> 
This is a content pane.</div> 
</body> 

Il comportamento che sto vedendo in questo momento è che il div viene visualizzato momentaneamente dopo aver fatto clic sul pulsante, ma poi di nuovo è nascosto. Che cosa sto facendo di sbagliato?

Answer 1

Penso che la logica show/hide sia indietro? Inoltre, penso che "visualizzato" provenga da una versione molto vecchia di Dojo. Provate solo guardando lo stile invece (si noti che questa ribalta ancora una volta la logica come ho verificare la presenza di 'none')

toggler[(dojo.style("panel","display") == "none") ? 'show':'hide'](); 

C'è un esempio che utilizza in the docs dojo.connect per ottenere lo stesso effetto.