`

Ext 中的Tree实现不同节点不同的右键菜单

阅读更多

首先了解 Ext.Tree.Node.attributes的用法:

定义如下数据(其中有自定义类型type):

js 代码
  1. [{"text":"a","id":"1","cls":"folder","type":"4"},{"text":"b","id":"2","cls":"folder","type":"3"}]  

通过 Tree.TreeLoader 加载数据后可以通过如下语法读取type自定义属性

js 代码
  1. node.attributes.type  

 

了解自定义属性用法后可在Tree的contextmenu事件中控制不同类型的结点显示不同的菜单了,关键代码:

js 代码
  1. prepareCtx:function(node, e){   
  2.         node.select();   
  3.         if(node.attributes.type=="3");{   
  4.        ctxMenu.showAt(e.getXY());   
  5.         }   
  6.        if(node.attributes.type=="4"){   
  7.          ctxMenu1.showAt(e.getXY());   
  8.        }   
  9.       }   

 

完整例子见附件,注:此例子中包含ext库文件,如需运行需将ext库文件放入ajax/yui目录

分享到:
评论
6 楼 lht_ge 2011-06-01  
zzzzzzzzzzzzzzzzzzzzzzzz
5 楼 lchj 2009-06-18  
谢谢楼主了
4 楼 sixday 2008-08-28  
谢谢博主 学习一下
3 楼 qiu768 2008-07-24  
谢谢博主,俺正需要!!
2 楼 xwinner 2008-06-11  
   
1 楼 122410832 2008-03-22  
    

相关推荐

    ExtJS 自定义树组件 节点的操作 搜索 右键菜单

    功能: 1.实现ExtJS tree 节点右键菜单 实现增删查. 2.实现针对实体数据的动态搜索. 3.代码命名规范,简单易懂. 4.支持IE 9,FF 19.0.2. 5.将文件解压至ext包example任意组件文件夹即可浏览效果.

    ext-tree.rar_ext_ext tr_ext tre_ext.tr_ext.tree

    ext的树的实例.通过右键菜单操作树节点对数据库进行增删改查.

    复选框的且带右键菜单的树代码

    下面是复选框的且带右键菜单的树代码。 HTML code Ext.BLANK_IMAGE_URL = "../resources/images/default/s.gif"; Ext.QuickTips.init(); Ext.state.Manager.setProvider(new Ext.state.CookieProvider()); ...

    Extjs 中的 Treepanel 实现菜单级联选中效果及实例代码

    其中Ext.tree.TreeNode代表一个树节点,比较常用的属性包括text、id、icon、checked等、异步树Ext.tree.AsyncTreeNode、树加载器Ext.tree.TreeLoader。下面介绍Extjs 中的 Treepanel 实现菜单级联选中效果。 在 ...

    EXT2.0中文教程

    9.6. JsonView实现用户卡片拖拽与右键菜单 9.7. 下拉列表选择每页显示多少数据 10. 撕裂吧!邪魔外道与边缘学科。 10.1. dwr与ext整合 10.1.1. 无侵入式整合dwr和ext 10.1.2. DWRProxy 10.1.3. DWRTreeLoader 10.2...

    Ext 开发指南 学习资料

    9.6. JsonView实现用户卡片拖拽与右键菜单 9.7. 下拉列表选择每页显示多少数据 10. 撕裂吧!邪魔外道与边缘学科。 10.1. dwr与ext整合 10.1.1. 无侵入式整合dwr和ext 10.1.2. DWRProxy 10.1.3. DWRTreeLoader 10.1.4...

    Ext+JS高级程序设计.rar

    6.3.2 在tree中使用Ext.Direct 181 6.3.3 为grid设置DirectStore 183 6.3.4 在form中使用Ext.Direct加载数据 185 6.3.5 在form中使用Ext.Direct提交数据 187 6.3.6 使用polling方式进行轮询 189 6.4 本章小结 191 第...

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

    9.6. JsonView实现用户卡片拖拽与右键菜单 9.7. 下拉列表选择每页显示多少数据 10. 撕裂吧!邪魔外道与边缘学科。 10.1. dwr与ext整合 10.1.1. 无侵入式整合dwr和ext 10.1.2. DWRProxy 10.1.3. DWRTreeLoader ...

    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生成树节点带链接

    extjs生成树菜单,多个子节点,支持无限分类,并且各个子菜单链接都加上,点击可触发相应的事件处理或者页面跳转。这个本来是在yii后台用的

    基于EXT SSI的简单树实现

    一个基于EXT实现的树,先上图。 动态加载加右键菜单。 希望拿到可以跑起来看看效果的,需要按以下步骤做。 1 安装oracle,这个例子只做了oracle版本,如果需要,后期可以加上mysql版本,呵呵。 2 运行建用户及表...

    ExtAspNet_v2.3.2_dll

    -增加示例(data/tree_select_run.aspx),如何选中当前节点的所有子节点(feedback:wjl_wjl520)。 +TreeNode的属性NodeId被重命名为NodeID,这是ExtAspNet中的一个命名约定。 -同时更名的还有GridColumn的...

    利用Ext Js生成动态树实例代码

    需求 要求生成一颗部门树,初始只列出根部门 当点击一个部门节点时,动态载入该部门下的直属子部门,并展开该部门节点 部门节点要求支持右键单击事件,当点击右键时,列出相关操作菜单 二. 关键类 这里主要涉及Ext ...

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

    10.11 树形节点视图——Ext.tree.TreeNodeUI 10.12 表格与树形的结合——Ext.ux.tree.ColumnTree 第11章 其他布局类简介 11.1 标准布局类 11.1.1 折叠布局——AccordionLayout 11.1.2 边框布局——BorderLayout...

    EXTjs 简单布局实例

    menuTree:new Ext.tree.TreePanel({ title:'功能菜单', region:'west', bodyStyle:'background:transparent url(images/default/panel/group-lr.gif) repeat-x 0 bottom;', id:'extExample-tree', autoScroll:true, ...

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

    10.11 树形节点视图——Ext.tree.TreeNodeUI 10.12 表格与树形的结合——Ext.ux.tree.ColumnTree 第11章 其他布局类简介 11.1 标准布局类 11.1.1 折叠布局——AccordionLayout 11.1.2 边框布局——BorderLayout...

    dtree、JavaScript编写成的简单的树形菜单组件

    并可以实现无限分级,下面是官方介绍的优点: - Unlimited number of levels(无限分级) - Can be used with or without frames(可用于框架或非框架页面) - Remembers the state of the tree between pages(在不同...

Global site tag (gtag.js) - Google Analytics