Impossible de créer des dijits via dojo.NodeList.instantiate

J'essaie d'obtenir des dijits en utilisant la méthode dojo.NodeList.instantiate, qui prend les éléments HTML existants et les transforme en dijits lorsque le DOM est chargé.Impossible de créer des dijits via dojo.NodeList.instantiate

La référence API pour la méthode instantiate peut être trouvée here.

L'exemple suivant, qui appelle la méthode instantiate dans la méthode dojo.addOnLoad, devrait créer un BorderContainer avec deux ContentPane cas, mais les DIVs restent comme ils commencent et ne deviennent pas dijits:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Dijit Test</title> 
    <style type="text/css"> 
     @import "dojoroot/dijit/themes/tundra/tundra.css"; 
     @import "dojoroot/dojo/resources/dojo.css"; 
    </style> 
    <script type="text/javascript" src="dojoroot/dojo/dojo.js" 
     djConfig="parseOnLoad: true"></script> 
    <script type="text/javascript"> 
     dojo.require("dijit.layout.BorderContainer"); 
     dojo.require("dijit.layout.ContentPane"); 

     dojo.addOnLoad(
      function() { 
       dojo.query("#divOuter").instantiate(
        dijit.layout.BorderContainer, { 
         design : 'sidebar', 
         gutters : false 
        } 
       ); 

       dojo.query("#divMiddle").instantiate(
        dijit.layout.ContentPane, { 
         region : 'center' 
        } 
       ); 

       dojo.query("#divRight").instantiate(
        dijit.layout.ContentPane, { 
         region  : 'right', 
         splitter : true 
        } 
       ); 
      } 
     ); 
    </script> 
</head> 
<body> 
    <div id="divOuter" style="width:400px;height:300px"> 
     <div id="divMiddle">Middle box</div> 
     <div id="divRight">Right box</div> 
    </div> 
</body> 
</html>

I J'ai essayé le code ci-dessus dans Firefox 3.5 et Internet Explorer 7 et les deux ne parviennent pas à rendre les dijits. Si je spécifie un attribut HTML standard dans un objet de propriété (comme l'attribut style), ce changement de style apparaît correctement, ce qui indique que l'objet est en cours de lecture:

// The red border appears when using this example 
dojo.query("#divRight").instantiate(
    dijit.layout.ContentPane, { 
     region  : 'right', 
     splitter : true, 
     style  : 'border:1px solid red' 
    } 
);

Le code HTML suivant (en utilisant dojoType et d'autres attributs de propriété) fonctionne très bien - le BorderContainer et ContentPanes apparaissent correctement dans les deux navigateurs:

<div dojoType="dijit.layout.BorderContainer" design="sidebar" gutters="false" 
     style="width:400px;height:300px"> 
    <div dojoType="dijit.layout.ContentPane" region="center">Middle box</div> 
    <div dojoType="dijit.layout.ContentPane" region="right" splitter="true" 
     style="width:200px;">Right box</div> 
</div>

S'il vous plaît quelqu'un peut-il me dire pourquoi le instantiate exemple ne fonctionne pas?

J'ai fait beaucoup de recherche, mais je n'arrive pas à trouver quelqu'un d'autre avec ce problème, ce qui peut signifier que je n'utilise pas correctement la méthode instantiate!

Merci.

Source

2009-07-23 user143565

Vous devez appeler le démarrage sur ces dijits après leur instanciation. dojo.query.instantiate ne le fait pas pour vous puisqu'il crée simplement les objets.

Au bas de votre fonction onLoad, ajoutez-les:

dijit.byId('divOuter').startup(); 
dijit.byId('divMiddle').startup(); 
dijit.byId('divRight').startup();

Source

2009-07-23 22:04:18 seth

Merci beaucoup Seth - tout travail maintenant! – user143565

Vous êtes les bienvenus. – seth

Impossible de créer des dijits via dojo.NodeList.instantiate

Répondre

Questions connexes