dojo tree的操作及实例

前端之家收集整理的这篇文章主要介绍了dojo tree的操作及实例前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。


这是动态生成的一些插件,这是我项目中的一个页面,其中有dojo tree的展示

  1. (function(){
  2. dojo.provide("spolo.navigator.ugelocal");
  3. dojo.require("dijit.form.Button");
  4. dojo.require("dijit.Menu");
  5. dojo.require("dojo.data.ItemFileReadStore");
  6. dojo.require("dijit.Tree");
  7. dojo.require("dojo.store.JsonRest");
  8. dojo.require("dijit.MenuItem");
  9. dojo.require("dijit.form.Form");
  10. dojo.require("dijit.Dialog")
  11. dojo.require("dijit.form.ValidationTextBox");
  12. dojo.require("dijit.form.Select");
  13. dojo.require("dijit.layout.BorderContainer");
  14. dojo.require("dijit.layout.ContentPane");
  15. dojo.require("dojo.data.ItemFileReadStore");

  16. varusGov=newdojo.store.JsonRest({
  17. target:"",
  18. //判断有没有孩子节点
  19. mayHaveChildren:function(object){
  20. //等到路径path下的节点集合
  21. varhasNode=Sling.getContent(object.path,1);
  22. //遍历节点集合
  23. for(varchildinhasNode){
  24. varisHave=Sling.getContent(object.path+"/"+child,1);
  25. varitemnode=isHave.name;
  26. if(itemnode==object.name){}
  27. elseif(itemnode==undefined){}
  28. else{
  29. returntrue;//为true,则有孩子节点
  30. }
  31. }
  32. returnfalse;
  33. },
  34. //得到指定object下孩子节点
  35. getChildren:function(object,onComplete,onError){
  36. this.get(object.path+".tidy.1.json").then(function(fullObject){
  37. varpNode=object;
  38. //alert(object.children);
  39. varpath=object.path;
  40. vararrayObj=newArray();//声明一个数组用来放孩子节点集合
  41. varnode1=Sling.getContent(path,1);
  42. for(varnode2innode1){
  43. varaccessDir=path+"/"+node2;
  44. varitem=Sling.getContent(accessDir,1);
  45. //得到item的属性
  46. varitemitemnode=item.name;
  47. varitemitemFileType=item.fileType;
  48. varitemitemContent=item.content;
  49. vartype=item.type;
  50. item.children=newArray();
  51. if(itemnode==object.name){}
  52. elseif(itemnode==undefined){}
  53. else{
  54. //声明一个对象,包含各个指定的属性
  55. vartemp=newObject({
  56. id:Math.random(),//id属性
  57. name:itemnode,//name名称
  58. type:type,
  59. path:accessDir,//项目路径
  60. fileType:itemFileType,//项目文件类型
  61. content:itemContent,//文件包含的内容
  62. children:item.children,
  63. parentNode:pNode
  64. });
  65. arrayObj.push(temp);//把每个item节点对象放到arrayObj的集合中
  66. }
  67. }
  68. object.children=arrayObj
  69. onComplete(object.children);
  70. },onError);
  71. },
  72. //得到更节点
  73. getRoot:function(onItem,onError){
  74. this.get("/content/ugescene.json").then(onItem,
  75. //的每一个tree的节点名字,用的是后台数据的name属性
  76. getLabel:function(object){
  77. returnobject.name;
  78. },
  79. //更改一个tree节点
  80. put:function(object,options){
  81. //firetheonChildrenChangeevent
  82. this.onChildrenChange(object,object.children);
  83. //this.getChildren(object,onError);
  84. this.onChange(object);
  85. //executethedefaultaction
  86. returndojo.store.JsonRest.prototype.put.apply(this,arguments);
  87. }
  88. });
  89. //声明一棵树,场景树用来显示场景的目录结构
  90. varlocalSceneTree=newdijit.Tree({
  91. model:usGov,
  92. onClick:function(item,node,evt){
  93. //根据节点的类型来显示不同的toolbar
  94. if(item.type=="sector"){
  95. dojo.publish("/toolbar/changed",[{clsid:"spolo.toolbars.sectorToolbar"}]);
  96. }if(item.type=="mesh"){
  97. dojo.publish("/toolbar/changed",[{clsid:"spolo.toolbars.meshToolbar"}]);
  98. }
  99. window.document.getElementById('ugeScene').contentWindow.getMeshProperty(item.name);
  100. }
  101. });

  102. localSceneTree.startup();
  103. 以上是遍历一个josnrest的tree,他访问的是个json文件,或者说jcr中的一个节点,
  104. 他们都可以以josn的形式来访问。
  105. _getScenen:function(msg){
  106. //alert("message=============="+msg.message);
  107. //得到传递过来的休息
  108. vardata=msg.message;
  109. varlo=this._context.get("layout");
  110. varleft=lo.getRegion("left");
  111. //把得到的休息转化成json对象
  112. varrawdata=eval('('+data+')')
  113. //alert(rawdata);
  114. //声明store
  115. varstore=newdojo.data.ItemFileReadStore({
  116. data:{identifier:'id',label:'name',items:rawdata}
  117. });
  118. vartreeModel=newdijit.tree.ForestStoreModel({store:store,rootId:"laiba",rootLabel:"laiba"});
  119. //声明一个tree来显示store
  120. vartreeControl=newdijit.Tree({
  121. model:treeModel,
  122. showRoot:true,evt){
  123. //给scene传递休息
  124. //alert(item.name+item.type);
  125. varstr=item.name+","+item.type;
  126. if(item.type=='sector'){
  127. window.document.getElementById('ugeScene').contentWindow.getSectorProperty(str);
  128. }elseif(item.type=='mesh'){
  129. window.document.getElementById('ugeScene').contentWindow.getMeshProperty(str);
  130. }
  131. //dojo.publish("/toolbar/changed",[{clsid:"spolo.toolbars.sectorToolbar"}]);
  132. }
  133. });
  134. left.setContent("");
  135. //填充右侧toolbar
  136. treeControl.placeAt(left.domNode,'first');
  137. treeControl.startup();
  138. //把this对象赋给temp对象,这样为了调函数时this指针发生变化
  139. vartemp=this;
  140. //声明一个button,来测试选中tree中的某一个节点
  141. varbtn=newdijit.form.Button({
  142. label:"expand",
  143. onClick:function(){
  144. //选中tree中的某一个节点
  145. //定义一个数组
  146. varbuildme=[];
  147. varresult=temp.recursiveHunt("sectorlist",treeControl.model,buildme,treeControl.model.root);
  148. if(result&&result.length>0){
  149. treeControl.set('path',result);
  150. }
  151. }
  152. });
  153. btn.placeAt(left.domNode,'second');
  154. btn.startup();
  155. },
  156. recursiveHunt:function(lookfor,model,item){
  157. varid=model.getIdentity(item);//得到item的id
  158. buildme.push(id);//放到数组中
  159. if(id==lookfor){
  160. returnbuildme;//如果id符合条件,返回数组
  161. }
  162. for(varidxinitem.children){
  163. //slice()是用来截取数组中的一部分,用它来复制数组,如果省略了end参数,则切分的数组包含从start开始到数组结束的所有元素。
  164. //现在要用它来复制数组
  165. varbuildmebuildmebranch=buildme.slice(0);
  166. //递归
  167. varr=this.recursiveHunt(lookfor,buildmebranch,item.children[idx]);
  168. if(r){returnr;}
  169. }
  170. returnundefined;
  171. },
  172. 以上是一个把一json形式的字符串转化为json对象,让后便利的一种方法,还有定义了一个按钮,可以使tree
  173. 中的某一个节点被选中及打开他的父节点(expand one node in a dijit.tree)
原文链接:https://www.f2er.com/dojo/291601.html

猜你在找的Dojo相关文章