ExtJS学习笔记(七) 使用树控件TreeNode
2009-09-06 01:43
302 查看
在ExtJS中,不管是叶子节点还是非叶子节点,都统一用TreeNode表表示树的节点。在ExtJS中,有两种类型的树节点。一种节点是普通的简单树节点,由Ext.tree.TreeNode定义,另外一种是需要异步加载子节点信息的树节点,该类由Ext.tree.AsyncTreeNode定义。 看下面的代码:
执行程序,点击树中的“根节点”则会一直发现树会尝试加载这个节点的子节点,由这里没有指定树的加载器,所以“根节点”会变成一直处于加载的状态。如下图所示:
对于普通的TreeNode来说,可以通过调用节点的appendChild、removeChild等方法来往该节点中加入子节点或删除子节点等操作。
TreeNode与AsyncTreeNode可以同时使用,比如下面的代码:
执行上面的程序可以得到一棵如下图所示的树:
另外要在树以外的程序中得到当前选择的节点,可以通过TreePanel的getSelectionModel方法来获得,该方法默认返回的是Ext.tree.DefaultSelectionModel对象,DefaultSelectionModel的getSelectedNode方法返回当前选择的树节点。比如要得到树tree中中当前选择节点,代码如下:
Ext.onReady(function(){ var tree=new Ext.tree.TreePanel({ renderTo:"hello", root:new Ext.tree.AsyncTreeNode({ text:"根节点" }), width:100 }); });
执行程序,点击树中的“根节点”则会一直发现树会尝试加载这个节点的子节点,由这里没有指定树的加载器,所以“根节点”会变成一直处于加载的状态。如下图所示:
对于普通的TreeNode来说,可以通过调用节点的appendChild、removeChild等方法来往该节点中加入子节点或删除子节点等操作。
TreeNode与AsyncTreeNode可以同时使用,比如下面的代码:
Ext.onReady(function(){ var root=new Ext.tree.TreeNode({ id:"root", text:"树的根" }); var c1=new Ext.tree.TreeNode({ text:"子节点1" }) var c2=new Ext.tree.AsyncTreeNode({ text:"子节点2" }); root.appendChild(c1); root.appendChild(c2); var tree=new Ext.tree.TreePanel({ renderTo:"hello", root:root, width:300, loader:new Ext.tree.TreeLoader({ applyLoader:false, url:"treedata.js" }) }); }); treedata.js中的内容仍然是: [{ id: 1, text: '子节点' }]
执行上面的程序可以得到一棵如下图所示的树:
另外要在树以外的程序中得到当前选择的节点,可以通过TreePanel的getSelectionModel方法来获得,该方法默认返回的是Ext.tree.DefaultSelectionModel对象,DefaultSelectionModel的getSelectedNode方法返回当前选择的树节点。比如要得到树tree中中当前选择节点,代码如下:
tree.getSelectionModel().getSelectedNode()
相关文章推荐
- ExtJs 学习笔记基础篇 Ext组件的使用第1/2页
- android 开发零起步学习笔记(十五):android: 静态XML和动态加载XML混合使用,以及重写Layout控件
- C#学习笔记(20140911)-下拉框、日历、pannel控件的使用
- WPF学习笔记--使用配置文件修改控件、面板颜色
- ASP.NET学习笔记四 控件使用
- ASP.NET学习笔记--自定义验证控件的使用
- IOS 学习笔记(5) 控件 文本视图(UITextView)的使用方法
- C#学习笔记__容器控件的使用
- felx 入门学习笔记之6 List控件使用
- 学习笔记:Tab Bar 控件使用详解
- ExtJS4学习笔记九--数据模型的使用
- ios 学习笔记(8) 控件 按钮(UIButton)的使用方法
- C#学习笔记-WPF前端布局和控件的使用
- ExtJs学习笔记(21)-使用XTemplate结合WCF显示数据
- iOS学习笔记—— UItableView 控件的简单使用
- C#中使用Property Grid 控件 学习笔记
- iOS学习笔记—— UIPickerView 控件的简单使用
- 汇编语言学习笔记-使用窗体控件
- iOS学习笔记—— UISegmentedControl 控件的简单使用
- vs2010 学习Silverlight学习笔记(8):使用用户控件