Utilisation Dojo Tree

**guilopouloos** · 10/05/2010, 13h32

J'essaie d'utiliser l'exemple dojoTreeWidget
avec la librairie http://ajax.googleapis.com/ajax/libs...ojo/dojo.xd.js

je rencontre l'erreur suivante sur ma page client >>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

uncaught exception: Could not load cross-domain resources: dojo.lang.* dojo.widget.* dojo.widget.Tree

Pourtant cela semble hyper simple ...

Quel outil puis je utiliser pour faire un arbre ?

**guilopouloos** · 11/05/2010, 11h15

Bon j'ai trouvé la page de Dojo campus (enfin )
J'utilise un de leurs exemples, ma page n'a plus d'erreur jscript mais rien n'est affiché :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js" type="text/javascript"></script>
<script type="text/javascript">
    dojo.require("dojo.data.ItemFileReadStore");
    dojo.require("dijit.Tree");
</script>
 
	<div dojoType="dojo.data.ItemFileReadStore" jsId="continentStore" url="http://docs.dojocampus.org/moin_static163/js/dojo/trunk/dijit/tests/_data/countries.json">
</div>
<div dojoType="dijit.tree.ForestStoreModel" jsId="continentModel" store="continentStore"
query="{type:'continent'}" rootId="continentRoot" rootLabel="Continents"
childrenAttrs="children">
</div>
<div dojoType="dijit.Tree" id="mytree2" model="continentModel" showRoot="false">
</div>

**Eric Pasquier** · 12/05/2010, 15h09

Bonjour,
On ne voit pas tout ton code. Peux tu vérifier que tu as bien les lignes suivantes :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<style type="text/css">
    @import "/dojo/dijit/themes/soria/soria.css";
 
html, body {
  height: 100%;
}
</style>
<body class="soria">

**guilopouloos** · 12/05/2010, 16h06

Effectivement ca n'y était pas, je l'ai ajouté sans correction... Voici mon code complet

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
 
<html>
 
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js" type="text/javascript"></script>
 
<script type="text/javascript" src="./dojo-1.4.2/dojo/dojo.js"></script>
 
<script type="text/javascript">
    dojo.require("dojo.data.ItemFileReadStore");
    dojo.require("dijit.Tree");
</script>
 
<style type="text/css">
    @import "/dojo/dijit/themes/soria/soria.css";
 
html, body {
  height: 100%;
}
</style>
 
<body class="soria">
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js" type="text/javascript"></script>
<script type="text/javascript">
    dojo.require("dojo.data.ItemFileReadStore");
    dojo.require("dijit.Tree");
</script>
 
	<div dojoType="dojo.data.ItemFileReadStore" jsId="continentStore" url="http://docs.dojocampus.org/moin_static163/js/dojo/trunk/dijit/tests/_data/countries.json">
</div>
<div dojoType="dijit.tree.ForestStoreModel" jsId="continentModel" store="continentStore"
query="{type:'continent'}" rootId="continentRoot" rootLabel="Continents"
childrenAttrs="children">
</div>
<div dojoType="dijit.Tree" id="mytree2" model="continentModel" showRoot="false">
</div>
 
</body>
</html>

**Eric Pasquier** · 12/05/2010, 16h57

Et l'appel au "parser" ?

**guilopouloos** · 12/05/2010, 17h26

Franchement j'y comprend pas grand chose, j'ai repris l'exemple http://dojocampus.org/explorer/#Dijit_Tree_Basic
Je ne sais pas bien de quoi tu parles... suis un vrai nase sur le coup

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
 
 
<html>
 
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js" type="text/javascript"></script>
 
<script type="text/javascript" src="./dojo-1.4.2/dojo/dojo.js"></script>
 
 
 
<style type="text/css">
    @import "/dojo/dijit/themes/soria/soria.css";
 
html, body {
  height: 100%;
}
</style>
 
<body class="soria">
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js" type="text/javascript"></script>
<script language="JavaScript" type="text/javascript">
  dojo.require("dojo.data.ItemFileReadStore");
  dojo.require("dijit.Tree");
  dojo.require("dojo.parser");  // scan page for widgets and instantiate them
</script>
 
<div dojoType="dojo.data.ItemFileReadStore" jsId="continentStore"
  url="http://docs.dojocampus.org/moin_static163/js/dojo/trunk/dijit/tests/_data/countries.json"></div>
 
<h3>Tree with hardcoded root node (not corresponding to any item in the store)</h3>
<div dojoType="dijit.Tree" id="tree1" store="continentStore" query="{type:'continent'}"
  labelAttr="name" label="Continents">
  <script type="dojo/method" event="onClick" args="item">
    if(item){
      alert("Execute of node " + continentStore.getLabel(item)
        +", population=" + continentStore.getValue(item, "population"));
    }else{
      alert("Execute on root node");
    }
  </script>
</div>
 
Click <a href="featureexplorer/Dojo/countries.json" target="_new">here</a> to see the data used to populate the tree.
</body>
</html>

**Eric Pasquier** · 12/05/2010, 18h03

Et bien regarde le code source (de la page HTML) ou un des nombreux exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
dojo.require("dojo.parser");  // scan page for widgets and instantiate them
 
<script type="text/javascript" src="/dojotoolkit/dojo/dojo.js" djConfig="isDebug: false, parseOnLoad: true"></script>

Bon courage !
Eric.

**emmanuel.remy** · 17/05/2010, 16h39

Salut,

@guilopouloos:

2 remarques:

le code issu de ton premier post concernait la version 0.4 de dojo
Une refonte a eu lieu à partir de la version 0.9 d'où ce souci de librairies... (dojo.widget n'existe plus, etc...)

Si tu charges dojo.js à partir d'un CDN (Google, AOL, ...) et que tu fais de même pour les CSS, alors le chemin des CSS est lui aussi lié au CDN.
Par exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js" type="text/javascript"></script>
 
<style type="text/css">
    @import url(http://ajax.googleapis.com/ajax/libs/dojo/1.4/dijit/themes/soria/soria.css);
...

Une autre solution est d'avoir dojo en local...

ERE

**guilopouloos** · 17/05/2010, 17h33

Merci ca marche au top

quelque chose me dit que c'est le début des ennuis...

**emmanuel.remy** · 17/05/2010, 17h47

Re,

Envoyé par guilopouloos

Merci ca marche au top

quelque chose me dit que c'est le début des ennuis...

On peut voir les choses différemment: "L'appétit vient en mangeant ..."

Bonne découverte de dojo,

ERE

**malek_IET** · 17/05/2010, 19h57

Envoyé par emmanuel.remy

Salut,

@guilopouloos:

2 remarques:

le code issu de ton premier post concernait la version 0.4 de dojo
Une refonte a eu lieu à partir de la version 0.9 d'où ce souci de librairies... (dojo.widget n'existe plus, etc...)

Si tu charges dojo.js à partir d'un CDN (Google, AOL, ...) et que tu fais de même pour les CSS, alors le chemin des CSS est lui aussi lié au CDN.
Par exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js" type="text/javascript"></script>
 
<style type="text/css">
    @import url(http://ajax.googleapis.com/ajax/libs/dojo/1.4/dijit/themes/soria/soria.css);
...