`
tanglei198577
  • 浏览: 60252 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类

A example of treepanel of Ext

EXT 
阅读更多
var root = new Ext.tree.TreeNode({
                 id:"root",
                 text:"Sample"
            });
        var ITDep = new Ext.tree.TreeNode({id:"c1",text:"IT Dep",href:"http://www.sina.com",hrefTarget:"_blank",leaf:false});
        var HRDep = new Ext.tree.TreeNode({id:"c2",text:"HR Dep",leaf:false});
        root.appendChild(ITDep);
        root.appendChild(HRDep);
        ITDep.appendChild(new Ext.tree.TreeNode({id:"c3",text:"Leo",leaf:true}));
        ITDep.appendChild(new Ext.tree.TreeNode({id:"c4",text:"Tom",leaf:true}));
        ITDep.appendChild(new Ext.tree.TreeNode({id:"c5",text:"Ray",leaf:true}));
        HRDep.appendChild(new Ext.tree.TreeNode({id:"c6",text:"Sarah",leaf:true}));
        var tree = new Ext.tree.TreePanel({
            renderTo:"hello",
            root: root,
            width:100
            });
        tree.on("click",function(node,event){
              alert("click on "+node.text);
            });

 

2
1
分享到:
评论

相关推荐

    ext2.0的源码和一些example

    学习example中的实际应用案例,如grid的拖拽和树的拖拽,可以帮助我们更好地掌握EXT 2.0的使用技巧,同时提升项目开发能力。 总之,EXT 2.0的源码和示例为开发者提供了一条深入理解EXT工作机制的路径,通过学习和...

    JSP EXT 遍历 TREE

    最后,dmtest.jsp是我们的主JSP页面,它可能包含了EXT的配置和布局,以及调用前述的example4.js中的函数来初始化和操作TREE。在JSP页面中,我们可能看到类似以下的代码片段: ```jsp <%@ taglib prefix="ext" uri=...

    Ext左树有表格 增删改查

    var treePanel = Ext.create('Ext.tree.Panel', { store: treeStore, width: 200, renderTo: Ext.getBody() }); ``` 接下来,表格组件(GridPanel)是用于展示二维数据的,通常与数据存储(Data Store)结合使用...

    ExtJs GridPanel双击事件获得双击的行

    {name: 'John Doe', email: 'john.doe@example.com', phone: '555-1234'}, // 更多数据... ] }); var columns = [ {header: 'Name', dataIndex: 'name', flex: 1}, {header: 'Email', dataIndex: 'email', ...

    Json(struts2+Ext)

    比如,你可以使用Ext.data.Store来存储和加载JSON数据,然后将其绑定到GridPanel、TreePanel等组件上。 ```javascript var store = Ext.create('Ext.data.Store', { model: 'User', proxy: { type: 'ajax', url...

    老师整理的extjs学习笔记

    构建一棵静态的树通常需要预先定义好树的数据结构,然后通过 `Ext.tree.TreePanel` 的配置选项来展示。 **9.3 构建动态的树** 构建动态的树则需要在运行时通过 AJAX 调用等方式动态加载子节点。这通常涉及到使用 `...

    Extjs,ExtTLD框架

    <ext:treepanel id="tree" title="Tree Example" width="200" height="200"> <ext:root> <ext:node text="Node 1"> <ext:node text="Child Node 1.1"/> <ext:node text="Child Node 1.2"/> </ext:node> <ext:...

    Ext范例,增删改查,树,界面设计

    这个压缩包文件包含的示例和资源主要展示了如何利用ExtJS实现数据操作(增删改查)以及树形视图(TreePanel)的界面设计。 首先,"增删改查"(CRUD,Create、Read、Update、Delete)是任何数据驱动应用的基础功能。...

    extjs tree示例

    var treePanel = Ext.create('Ext.tree.Panel', { title: 'Tree Example', width: 200, store: treeStore, rootVisible: false, renderTo: Ext.getBody() }); ``` 在上述代码中,我们创建了一个TreeStore,并...

    ExtJs在struts2.0.x下实现动态树的解决方案

    var treePanel = Ext.create('Ext.tree.Panel', { store: treeStore, title: 'Dynamic Tree', width: 300, height: 300, renderTo: Ext.getBody() }); ``` 5. **处理用户交互** 当用户点击节点时,可以...

    extjs表格、树控件

    var tree = new Ext.tree.TreePanel({ renderTo: 'tree-example', title: 'Tree Example', width: 300, root: new Ext.tree.AsyncTreeNode({ text: 'Root Node', expanded: true, loader: new Ext.tree....

    ExtJS实用开发指南

    3. **常用组件**:包括`Ext.grid.GridPanel`(表格)、`Ext.tree.TreePanel`(树形视图)、`Ext.form.FormPanel`(表单)等。 4. **自定义组件**:开发者可以根据需要创建自己的组件,实现特定的功能需求。 #### 五、...

    Extjs4 Treegrid 使用心得分享(经验篇)

    Extjs4 Treegrid是基于Ext JS框架的一个模块,用于创建树形结构的数据网格。Ext JS是一个成熟的、基于JavaScript的前端框架,它提供了一套丰富的UI组件,用来创建丰富的交互式应用程序。Treegrid结合了树形视图和...

Global site tag (gtag.js) - Google Analytics