extjs treePanel checkBox级联
2015-05-07 23:23
337 查看
效果图:点击父级,全选/取消全部子级别,点击子级别(递归判断父级是否应该被选中)
转载自:http://blog.sina.com.cn/s/blog_6dc1452201019trh.html
{ title: '菜单测试', xtype:'treepanel', id:'treeMenuId', width: 200, height:300, store: leftTreeStore, hideHeaders: true, rootVisible: true, useArrows: true, listeners:{ checkchange:function(node,checked,obj){ node.cascadeBy(function (n) {//子节点随父节点状态的改变而改变 n.set('checked', checked); }); checkParent(node);//父节点状态的判断 function checkParent(node){ node = node.parentNode; if(!node) return;//如果是父节点,则停止递归 var checkP=false; node.cascadeBy(function (n){ if (n != node) { if (n.get('checked') == true) { checkP = true;//如果有一个子节点是选中状态,则父节点也为选中状态 } } }); node.set('checked', checkP); checkParent(node);//递归 } } }, dockedItems: [{ xtype: 'toolbar', items: { text: '获取选择值', handler: function(){ var records = Ext.getCmp("treeMenuId").getView().getChecked(), names = []; Ext.Array.each(records, function(rec){ //console.log(rec.raw.menuId); names.push(rec.get('text')); }); Ext.MessageBox.show({ title: 'Selected Nodes', msg: names.join(''), icon: Ext.MessageBox.INFO }); } } }] }
转载自:http://blog.sina.com.cn/s/blog_6dc1452201019trh.html
相关文章推荐
- Extjs4 treePanel + checkbox 级联选中
- ExtJs Treepanel节点checkbox的半选中状态复选框效果
- ExtJs之treePanel checkbox 复选框
- ExtJs3.4 TreePanel级联勾选节点并实现父节点节点半选
- extjs treepanel checkbox得到所选的参数,浏览器不兼容的解决办法
- Extjs 中的 Treepanel 实现菜单级联选中效果及实例代码
- extjs ext.tree.panel 添加监听事件
- ExtJs Treepanel刷新树形菜单
- extjs中treepanel和tabpanel结合实现布局
- ExtJS4 Ext.tree.Panel获取Node对象
- Extjs treepanel 远程URL
- 我自己写的关于EXTJS的TreePanel、viewPort和tabPanel动态切换和添加tabpanel的例子
- 【无事水一发】ExtJS4 Ext.tree.Panel (无限层级)带复选框树勾选(父级子级)联动代码
- ExtJs TreePanel
- ExtJS的导航栏(Accordion TreePanel)
- extjs.treePanel在ie9下滚动条的显示问题
- ExtJs4.0 TreePanel+CheckBox全选
- Extjs中通过Tree加载右侧TabPanel具体实现
- Extjs中左边treepanel右边panel动态加载jsp页面
- 征服ExtJs那棵树(ExtJs官方开发手册汉语详解--TreePanel)