第十二讲：ExtJS组件之TreePanel(下).doc

示例一：树的一些常用配置属性。 Ext.onReady(function(){ var loader=new Ext.tree.TreeLoader({ url:treedata3.js }); var root=new Ext.tree.TreeNode({ id:root, text:根节点 }); root.appendChild(new Ext.tree.TreeNode({ id:child1, text:子节点1 })) root.appendChild(new Ext.tree.AsyncTreeNode({ id:child2, text:子节点2, loader:loader })) var tree=new Ext.tree.TreePanel({ renderTo:TestTree, root:root, width:400, height:400, animate:false,//收缩动画 autoHeight:true, //自动高度 enableDrag:true, //是否可以拖动 //enableDD:true, //drap和drop enableDrop:true, //放置节点 lines:false,//节点间虚线 rootVisible:false,//是否显示根节点 trackMouseOver:true,//是否时效果 useArrows:true//是否使用小箭头 }); })Ext.onReady(function(){ Ext.QuickTips.init(); var loader=new Ext.tree.TreeLoader({ url:treedata3.js }); var root=new Ext.tree.TreeNode({ id:root, text:根节点, checked:true, //true则在text前有个选中的复选框,false则text前有个未选中的复选框,默认没有任何框框 expanded:true, //是否展开 qtip:根节点, //提示信息 singleClickExpand:true //单击文本展开 }); root.appendChild(new Ext.tree.TreeNode({ id:child1, text:子节点1 })) root.appendChild(new Ext.tree.AsyncTreeNode({ id:child2, text:子节点2, loader:loader })) var tree=new Ext.tree.TreePanel({ renderTo:TestTree, root:root, width:400, height:400 }); }) 示例三：从JSP中获得数据并构造动态树。 Ext.onReady(function(){ //根节点 var root = new Ext.tree.AsyncTreeNode({ id:root, text:根节点, loader:new Ext.tree.TreeLoader({ url:AsyncServer2.jsp }) }) var treePanel = new Ext.tree.TreePanel({ renderTo:AsyncTree, width:300, height:400, root:root }) }) %@ page language=java import=java.util.* pageEncoding=utf-8% % String tree = [{id:childnode1,text:子节点,leaf:false}]; response.getWriter().write(tree); % %@ page language=java import=java.util.* pageEncoding=utf-8% % StringBuffer tree = new StringBuffer(); tree.append([); tree.append({text:子节点1,id:son1,leaf:true},); tree.append({text:子节点2,id:son2,leaf:true},); tree.append({text:子节点3,id:son3,leaf:true}); t