J'ai un petit projet que je fais, et j'utilise Dojo pour cela. Pour l'instant je ne peux pas tout charger correctement. J'essaie d'utiliser le thème Tundra. Essentiellement, le problème est que tabContainer manque d'onglets, a des polices serif au lieu de sans-serif, et affiche tous les ContentPanes à l'intérieur de celui-ci au lieu de les cacher dans les onglets non-actifs. Le problème de serif s'applique également à tous les autres éléments Dijit que j'essaie de créer, cependant les éléments de forme Dijit semblent fonctionner un peu mieux (sauf que la police est incorrecte, elle a un style correct et la validation et d'autres trucs fonctionnent bien).Onglets Dijit TabContainer manquants, polices serif, tous les conteneurs visibles
Le même problème apparaît lors de l'utilisation des autres thèmes Dijit, mais la couleur de la bordure TabContainer change avec chaque thème différent, ce qui me porte à croire que le thème Dijit peut se charger correctement. Dojo semble bien créer les éléments Dijit, en regardant la sortie Firebug plus bas.
Des copies complètes des répertoires Dojo 1.3.2 dojo, dijit et dojox existent dans js/dojo. Toutes les feuilles de style et tous les scripts liés sont initialement chargés et les chemins d'accès sont corrects (j'ai testé pour confirmer cela avec des boîtes d'alerte dans js et la couleur du corps changeant dans css).
index.html
<!DOCTYPE HTML>
<html>
<head>
<link href="js/dojo/dijit/themes/tundra/tundra.css" rel="stylesheet">
<script src="js/dojo/dojo/dojo.js"></script>
<script src="js/script.js"></script>
</head>
<body class="tundra">
<div id="xmldiv">
</div>
<script language="javascript">xmlEnableDiv('xmldiv');</script>
</body>
</html>
js/script.js
function xmlEnableDiv(div) {
dojo.require("dijit.layout.TabContainer");
dojo.require("dijit.layout.ContentPane");
var tc = new dijit.layout.TabContainer({
}, div);
var cp1 = new dijit.layout.ContentPane({
id: "xmleditor",
title: "Editor",
content: "This is where the editor will actually go"
});
tc.addChild(cp1);
var cp2 = new dijit.layout.ContentPane({
id: "xmltext",
title: "Source",
content: "This is where the source will actually go"
});
tc.addChild(cp2);
}
Vérification Firebug, je vois ce qui suit (qui ressemble à mes yeux comme il se doit):
<body class="tundra">
<div id="xmldiv" class="dijitTabContainer dijitContainer dijitTabContainerTop dijitLayoutContainer" widgetid="xmldiv">
<div id="xmldiv_tablist" class="dijitTabContainerTop-tabs" dojoattachevent="onkeypress:onkeypress" wairole="tablist" role="tablist" widgetid="xmldiv_tablist"/>
<div class="dijitTabSpacer dijitTabContainerTop-spacer" dojoattachpoint="tablistSpacer"/>
<div class="dijitTabPaneWrapper dijitTabContainerTop-container" dojoattachpoint="containerNode" role="tabpanel">
<div id="xmleditor" class="dijitContentPane" title="" widgetid="xmleditor" role="group">This is where the editor will actually go</div>
<div id="xmltext" class="dijitContentPane" title="" widgetid="xmltext" role="group">This is where the source will actually go</div>
</div>
</div>
<script language="javascript">
xmlEnableDiv('xmldiv');
</script>
</body>
La sortie réelle (dans Firefox et Chrome) est une boîte (TabContainer) avec une bordure thématique. Il n'y a aucun onglet sur le TabContainer, et les deux ContentPanes sont visibles en même temps (les deux avec des polices serif).
Les choses que j'ai essayé sans succès:
- fait un (dojo.parser.parse) à la fin de ma fonction init
- Essayer d'autres Dijits. Ils agissent de la même manière en ce sens qu'ils semblent charger partiellement. Chaque Dijit a des polices serif au lieu de sans-serif, mais les éléments de formulaire et le dialogue s'affichent tous les deux correctement en dehors de la police incorrecte
Merci d'avance, cela me rend fou.
En tant que mise à jour, tout fonctionne parfaitement déclarative mais ne fonctionne pas par programme. Quelqu'un peut-il voir un problème avec mon JavaScript? – beefsack