`
jiangnan2112
  • 浏览: 120416 次
  • 性别: Icon_minigender_1
  • 来自: 重庆
社区版块
存档分类
最新评论

EXT tree 树入门学习

EXT 
阅读更多
学习EXT中tree的入门笔记。 
EXT代码：
Ext.onReady(function(){
    var tree = new Ext.tree.TreePanel({el:'test'});            //建造树    test与页面div的id对应  el 为EL，而不是E一
    var root = new Ext.tree.TreeNode({text:'我是祖先'});        //根节点
    var node1 = new Ext.tree.TreeNode({text:'我是爷爷'});
    var node2 = new Ext.tree.TreeNode({text:'我是爷爷的兄弟'});
    var node3 = new Ext.tree.TreeNode({text:'我是父亲'});    
    var node4 = new Ext.tree.TreeNode({text:'我是孙子'});    
    node3.appendChild(node4);        //添加相应的子节点
    root.appendChild(node1); 
    node1.appendChild(node3);
    root.appendChild(node2);   
    tree.setRootNode(root);         //设置根节点
    tree.render();
   root.expand(true,true);        //是否自动展开，不需要点击子节点
});


页面代码：
    <body>
        <div id="test" style="height:300px;"></div>
        //一定要设置高度，要然看不到效果 style="height:300px"
    </body>


效果如下：

  • 大小: 8 KB
分享到：
| SVN Commit 提交失败
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    ExtJsByZheng.rar_ExtJsByZheng_ext_ext 标签_ext tree_grid

    Ext基本使用入门例子：包括布局，窗口，Tab，Tree，grid等，后台使用Servlet。可以直接在MyEclipse6中运行。

    Ext 开发指南 学习资料

    9.2. 带全选的checkbox树形CheckBoxTree 9.3. 带全选的checkbox的grid 9.4. fisheye 9.5. 可以设置时间的日期控件 9.6. JsonView实现用户卡片拖拽与右键菜单 9.7. 下拉列表选择每页显示多少数据 10. 撕裂吧！...

    ext很多教程资料。

    ExtJS2.1教程Tree_树控件_。ExtJS_配置和表格控件使用。Extjs入门培训教程。Extjs最经典的学习教程。ext布局。ext几个实例。EXT开发指南。EXT树简介。JavaScript使用手册。很多的extjs教程，你6分下载这个压缩包很值...

    Ext入门学习实例教程其中包含实例

    Ext 入门学习文档，其中包含实例...............................................................

    EXT2.0中文教程

    9.2. 带全选的checkbox树形CheckBoxTree 9.3. 带全选的checkbox的grid 9.4. fisheye 9.5. 可以设置时间的日期控件 9.6. JsonView实现用户卡片拖拽与右键菜单 9.7. 下拉列表选择每页显示多少数据 10. 撕裂吧！...

    Ext Js权威指南(.zip.001

    7.5.11　树节点：ext.data.nodeinterface与ext.data.tree / 364 7.5.12　store的方法 / 366 7.5.13　store的事件 / 368 7.5.14　store管理器：ext.data.storemanager / 369 7.6　综合实例 / 369 7.6.1　远程读取json...

    Ext学习必备，涵盖大量实例，插件，其他有用组件

    这个包是在之前包的基础上多加了很多功能。 原来的内容： 1ext2.2源码及例子 2深入浅出extJs例子 3自己写的例子 470过个插件 新增内容： 1通过dtree将所有例子搞成一颗树，方便大家观看效果 2新增dhtmlx上传文件 3...

    EXT教程EXT用大量的实例演示Ext实例

    9.2. 带全选的checkbox树形CheckBoxTree 9.3. 带全选的checkbox的grid 9.4. fisheye 9.5. 可以设置时间的日期控件 9.6. JsonView实现用户卡片拖拽与右键菜单 9.7. 下拉列表选择每页显示多少数据 10. 撕裂吧！...

    extjs4 入门基础，form、grid、tree

    简单入门ext要自己去官网下载ext4.21版本，导入到服务路径即可

    ext js2.0 json java web 项目例子

    一个简单的ext java web项目 有gird form tree boder布局 如果有人觉的有用，会继续完善

    前端开发Extjs入门-tree

    结合tree组件+grid组件+window组件实现json数据的自动加载，点击后自动勾选父子节点,前后台源代码

    精通JS脚本之ExtJS框架.part1.rar

    10.12 表格与树形的结合——Ext.ux.tree.ColumnTree 第11章 其他布局类简介 11.1 标准布局类 11.1.1 折叠布局——AccordionLayout 11.1.2 边框布局——BorderLayout 11.1.3 卡片式布局——CardLayout 11.1.4 ...

    掏钱学Ext(完整版) 附全部源码

    9.2. 带全选的checkbox树形CheckBoxTree 9.3. 带全选的checkbox的grid A. 常见问题乱弹 A.1. 怎么查看ext2里的api文档 A.2. 想把弹出对话框单独拿出来用的看这里 A.3. 想把日期选择框单独拿出来用的看这里 ...

    ExtJS入门教程(超级详细)

    37、Ext.data.SimpleStore类 ………… 34 38、Ext.data.Tree类 …………………… 34 39、Ext.data.Node类 ………………… 34 40、Ext.Action类 ……………………… 35 41、Ext.Button类 …………………… 36 42、Ext...

    对LDAP的基本操作(Spring-ldap)+Ext实现显示LDAP的树状结构

    由于这些我也是才入门的时候写的，进行测试等用的，所以比较适合新手，对学习LDAP，extjs会有一定的帮助。 (需要改正的是extjs里那个节点的id要加上前面的id才行，比如ou=mail; 那它的子节点cn=wang的id应该是...

    EXT - 2011-5-30

    详细介绍了EXT从基础类的使用、form、grid、util、tree等全部的API和独立的html演示和源代码。

    精通JS脚本之ExtJS框架.part2.rar

    10.12 表格与树形的结合——Ext.ux.tree.ColumnTree 第11章 其他布局类简介 11.1 标准布局类 11.1.1 折叠布局——AccordionLayout 11.1.2 边框布局——BorderLayout 11.1.3 卡片式布局——CardLayout 11.1.4 ...

    ExtJS源码分析与开发实例宝典--书中代码

    快速入门部分讲解Ext JS的背景及体系结构，并通过案例实现让 读者快速入门。核心技术部分深入讲解Ext JS的核心基础知识，包括JS原生对象的扩展、事件机制、 模板模型、数据模型，包括一个机制、两个模型及六个扩展。...

    ExtJSWeb应用程序开发指南(第2版)

    4.1.3 Ext.form.field.Base基础表单字段 4.1.4 Ext.form.field.Text文本域 4.1.5 Ext.form.field.TextArea文本区 4.1.6 Ext.form.field.Number数字输入框 4.1.7 Ext.form.field.Checkbox复选框和Ext.form.field....

Magicbox
Global site tag (gtag.js) - Google Analytics