Dojo學習13 dijit.Tree 動態添加節點之一

時間 2019-11-17

標籤 dojo 學習 dijit.tree dijit tree 動態添加節點之一欄目 Dojo 简体版

原文原文鏈接

13. dijit.Tree 動態添加節點之一對dijit.Tree研究了好久，源代碼也看了好多遍了。對於fx這個類的研究還須要更深刻一步。動態添加樹的節點已經完成了。與你們分享一下：===========================================<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><title>test tree , dynamic add treenode</title><style type="text/css"> @import "../js/dojo/resources/dojo.css"; @import "../js/dijit/themes/tundra/tundra.css";</style> <script type="text/javascript" djConfig="parseOnLoad: true, isDebug: true" src="../js/dojo/dojo.js"></script><script type="text/javascript">/* author : amushen date:20070716 email:amushen@gmail.com*/ dojo.require("dijit.form.Button"); dojo.require("dijit.Tree"); dojo.require("dojo.data.JsonItemStore");function init(){ var treeData={identifier: 'name', label: 'name', items: [ { name:'China', type:'one',children:[{reference:'beijing'}] }, { name:'beijing', type:'city'}, { name:'USA' , type:'one'}, { name:'UK' , type:'one'} ] }; var store1=new dojo.data.JsonItemStore({data:treeData}); var _tree=new dijit.Tree({ widgetId:"tree", store:store1, query:{type:'one'}, labelAttr:"name", typeAttr:"type"},dojo.byId("tree"));}dojo.addOnLoad(init);function addNode(){ //add one treeNode var _tree=dijit.byId("tree"); var tdata={label:"FR",tree:_tree,item:{name:"FR",type:"one"}}; var child=new dijit._TreeNode(tdata); _tree.addChild(child,1); child._updateLayout(); _tree.getChildren()[2]._updateLayout(); child.setChildren({}); child._setExpando();// console.debug();}function addSecondNode(){ // add a treenode for FR var _tree=dijit.byId("tree"); var fr=_tree.getChildren()[1]; var tdata=[{label:"Paris",item:{type:"city",name:"Paris"}}]; fr.setChildren(tdata); fr.getChildren()[0].setChildren({}); fr.isFolder=true; fr.isExpanded=false; fr._updateLayout(); fr._setExpando();}function addThirdNode(){ var _tree=dijit.byId("tree"); var fr=_tree.getChildren()[1]; var tdata={label:"pp",tree:_tree,item:{name:"pp",type:"city"}}; var child=new dijit._TreeNode(tdata); child.setChildren({}); fr.addChild(child); child._updateLayout(); fr.getChildren()[0]._updateLayout();}</script></head><body class="tundra"><button id="b1" dojoType="dijit.form.Button" onclick="addNode()">add a treeNode</button><button id="b2" dojoType="dijit.form.Button" onclick="addSecondNode()">add another treeNode</button><button id="b3" dojoType="dijit.form.Button" onclick="addThirdNode()">add third treeNode</button><div id=tree></div></body></html>