Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Newer
Older
100644 147 lines (107 sloc) 5.397 kb
fcc4fff8 »
2011-11-20 monster commit from moinconverter, which is always done prior to the …
1 .. _dijit/tree/ForestStoreModel:
d608cc59 »
2011-11-20 \r\n -> \n conversion.
2
f89feb82 »
2011-11-28 regex change of level 1 headers to ====\nTEXT\n==== and level 2 heade…
3 ===========================
3ed69e1f »
2012-01-28 dijit/tree/ForestStoreModel AMD
4 dijit/tree/ForestStoreModel
9dd52dc6 »
2011-11-20 mondo whitespace change
5 ===========================
d608cc59 »
2011-11-20 \r\n -> \n conversion.
6
3ed69e1f »
2012-01-28 dijit/tree/ForestStoreModel AMD
7 The ForestStoreModel connects a data store with multiple "root" items to a :ref:`dijit/Tree <dijit/Tree>`.
d608cc59 »
2011-11-20 \r\n -> \n conversion.
8
9dd52dc6 »
2011-11-20 mondo whitespace change
9 An example might be a geographical database; there are multiple continents but no ''single'' top level item called "world".
d608cc59 »
2011-11-20 \r\n -> \n conversion.
10
9dd52dc6 »
2011-11-20 mondo whitespace change
11 Since Tree demands a single top level item, ForestStoreModel creates a fake item whose children are determined
12 by a query specified to the ForestStoreModel constructor.
d608cc59 »
2011-11-20 \r\n -> \n conversion.
13
9dd52dc6 »
2011-11-20 mondo whitespace change
14 Here's an example of a declarative initialization for a TreeStoreModel and for the data store that it connects to:
d608cc59 »
2011-11-20 \r\n -> \n conversion.
15
c49c87d5 »
2011-11-21 normalization
16 .. html ::
d608cc59 »
2011-11-20 \r\n -> \n conversion.
17
ca344779 »
2012-01-12 Convert dijit/ to use new data-dojo-type syntax, with MID's.
18 <div data-dojo-type="dojo/data/ItemFileReadStore" data-dojo-id="continentStore"
20e865a1 »
2011-12-14 tabs --> spaces
19 data-dojo-props="url:'_data/countries.json'"></div>
ca344779 »
2012-01-12 Convert dijit/ to use new data-dojo-type syntax, with MID's.
20 <div data-dojo-type="dijit/tree/ForestStoreModel" data-dojo-id="continentModel"
20e865a1 »
2011-12-14 tabs --> spaces
21 data-dojo-props="store:continentStore, query:{type:'continent'},
22 rootId:'continentRoot', rootLabel:'Continents', childrenAttrs:'children'"></div>
d608cc59 »
2011-11-20 \r\n -> \n conversion.
23
24
9dd52dc6 »
2011-11-20 mondo whitespace change
25 A few things to note here:
d608cc59 »
2011-11-20 \r\n -> \n conversion.
26
9dd52dc6 »
2011-11-20 mondo whitespace change
27 * The query returns multiple items
28 * There's a single fake root item created with the label "The World". The Tree will display that root item unless showRoot=false is specified. (However, even if Tree doesn't display it, it still exists.)
d608cc59 »
2011-11-20 \r\n -> \n conversion.
29
9dd52dc6 »
2011-11-20 mondo whitespace change
30 Monitoring changes to items
a21f591b »
2011-12-15 Convert example in Tree.rst to use ObjectStoreModel rather than Fores…
31 ===========================
48e6bb04 »
2011-12-06 break long lines
32 Note that ForestStoreModel is inherently complex because it's difficult to tell when the children of the top level (fake) item have changed.
33 For example:
d608cc59 »
2011-11-20 \r\n -> \n conversion.
34
9dd52dc6 »
2011-11-20 mondo whitespace change
35 * a new continent is added to the data store
36 * a new country is added to the data store
d608cc59 »
2011-11-20 \r\n -> \n conversion.
37
48e6bb04 »
2011-12-06 break long lines
38 ForestStoreModel has no way of knowing that the continent affects the top level node but the country doesn't.
39 The user needs to define the onNewItem() method, or otherwise ForestStoreModel will take the pessimistic inefficient approach.
d608cc59 »
2011-11-20 \r\n -> \n conversion.
40
9dd52dc6 »
2011-11-20 mondo whitespace change
41 For example:
d608cc59 »
2011-11-20 \r\n -> \n conversion.
42
c49c87d5 »
2011-11-21 normalization
43 .. js ::
d608cc59 »
2011-11-20 \r\n -> \n conversion.
44
3ed69e1f »
2012-01-28 dijit/tree/ForestStoreModel AMD
45 var model = new ForestStoreModel({
20e865a1 »
2011-12-14 tabs --> spaces
46 store: continentStore,
47 query: {type: 'continent'},
48 rootLabel: "The World",
49 onNewItem: function(item, parentInfo){
50 if(this.store.getValue(item, 'type') == 'continent'){
51 this._requeryTop();
52 }
53 this.inherited(arguments);
54 }
55 });
d608cc59 »
2011-11-20 \r\n -> \n conversion.
56
57
9dd52dc6 »
2011-11-20 mondo whitespace change
58 Moving items to/from the root node
a21f591b »
2011-12-15 Convert example in Tree.rst to use ObjectStoreModel rather than Fores…
59 ==================================
48e6bb04 »
2011-12-06 break long lines
60 It's also complicated because users need to define what to do when an element is dropped on to the root of the tree, or dragged from the root of the tree and dropped onto a sub-node.
61 You may want to, for example, change the item so that the "topLevel" attribute is set/unset.
62 It depends on the structure of the data store what the appropriate action is.
63 The developer should override onAddToRoot() and onLeaveRoot().
d608cc59 »
2011-11-20 \r\n -> \n conversion.
64
c49c87d5 »
2011-11-21 normalization
65 .. js ::
d608cc59 »
2011-11-20 \r\n -> \n conversion.
66
67f7d9eb »
2011-12-01 Fix spacing for braces, function(), if(), while(), for(), else, etc. …
67 onAddToRoot: function(/*item*/ item){
9dd52dc6 »
2011-11-20 mondo whitespace change
68 // summary
69 // Called when item added to root of tree; user must override
70 // to modify the item so that it matches the query for top level items
71 // example
72 // | store.setValue(item, "root", true);
73 console.log(this, ": item ", item, " added to root");
74 },
67f7d9eb »
2011-12-01 Fix spacing for braces, function(), if(), while(), for(), else, etc. …
75 onLeaveRoot: function(/*item*/ item){
9dd52dc6 »
2011-11-20 mondo whitespace change
76 // summary
77 // Called when item removed from root of tree; user must override
78 // to modify the item so it doesn't match the query for top level items
79 // example
80 // | store.unsetAttribute(item, "root");
81 console.log(this, ": item ", item, " removed from root");
82 }
a21f591b »
2011-12-15 Convert example in Tree.rst to use ObjectStoreModel rather than Fores…
83
84 Examples
85 ========
86
87 A programmatic tree
88 -------------------
89
90 Creating a programmatic tree is very simple:
91
92 .. code-example ::
93
94 .. js ::
95
f2aa0fbf »
2013-03-01 dijit/tree: dojo/ready --> dojo/domReady! in code examples
96 require(["dijit/Tree", "dojo/data/ItemFileReadStore", "dijit/tree/ForestStoreModel", "dojo/domReady!"],
97 function(Tree, ItemFileReadStore, ForestStoreModel){
98 var store = new ItemFileReadStore({
99 url: "{{dataUrl}}/dijit/tests/_data/countries.json"
a21f591b »
2011-12-15 Convert example in Tree.rst to use ObjectStoreModel rather than Fores…
100 });
f2aa0fbf »
2013-03-01 dijit/tree: dojo/ready --> dojo/domReady! in code examples
101
102 var treeModel = new ForestStoreModel({
103 store: store,
104 query: {"type": "continent"},
105 rootId: "root",
106 rootLabel: "Continents",
107 childrenAttrs: ["children"]
108 });
109
110 var myTree = new Tree({
111 model: treeModel
112 }, "treeOne");
113 myTree.startup();
3ed69e1f »
2012-01-28 dijit/tree/ForestStoreModel AMD
114 });
a21f591b »
2011-12-15 Convert example in Tree.rst to use ObjectStoreModel rather than Fores…
115
116 .. html ::
117
118 <div id="treeOne"></div>
119
120 Note that the childrenAttrs parameter to TreeStoreModel/ForestStoreModel is an array since it can list multiple attributes in the store.
121
122
123 A markup tree
124 -------------
125
126 .. code-example ::
127
128 .. js ::
129
3ed69e1f »
2012-01-28 dijit/tree/ForestStoreModel AMD
130 require(["dojo/parser", "dojo/data/ItemFileReadStore", "dijit/Tree"]);
a21f591b »
2011-12-15 Convert example in Tree.rst to use ObjectStoreModel rather than Fores…
131
132 .. html ::
133
ca344779 »
2012-01-12 Convert dijit/ to use new data-dojo-type syntax, with MID's.
134 <div data-dojo-type="dojo/data/ItemFileReadStore" data-dojo-id="continentStore"
3ed69e1f »
2012-01-28 dijit/tree/ForestStoreModel AMD
135 data-dojo-props="url:'{{dataUrl}}/dijit/tests/_data/countries.json'"></div>
ca344779 »
2012-01-12 Convert dijit/ to use new data-dojo-type syntax, with MID's.
136 <div data-dojo-type="dijit/tree/ForestStoreModel" data-dojo-id="continentModel"
3ed69e1f »
2012-01-28 dijit/tree/ForestStoreModel AMD
137 data-dojo-props="store:continentStore, query:{type:'continent'},
138 rootId:'continentRoot', rootLabel:'Continents', childrenAttrs:'children'"></div>
a21f591b »
2011-12-15 Convert example in Tree.rst to use ObjectStoreModel rather than Fores…
139
ca344779 »
2012-01-12 Convert dijit/ to use new data-dojo-type syntax, with MID's.
140 <div data-dojo-type="dijit/Tree" id="mytree"
3ed69e1f »
2012-01-28 dijit/tree/ForestStoreModel AMD
141 data-dojo-props="model:continentModel, openOnClick:true">
142 <script type="dojo/on" data-dojo-event="click" data-dojo-args="item">
143 alert("Execute of node " + continentStore.getLabel(item)
a21f591b »
2011-12-15 Convert example in Tree.rst to use ObjectStoreModel rather than Fores…
144 +", population=" + continentStore.getValue(item, "population"));
3ed69e1f »
2012-01-28 dijit/tree/ForestStoreModel AMD
145 </script>
a21f591b »
2011-12-15 Convert example in Tree.rst to use ObjectStoreModel rather than Fores…
146 </div>
Something went wrong with that request. Please try again.