`
shaohan126448
  • 浏览: 115810 次
  • 来自: 北京
社区版块
存档分类
最新评论

Extjs 动态选择树的节点

EXT 
阅读更多
Java代码 复制代码
  1. var deptUserData = [];   
  2. <s:if test="deptUserData!=null">   
  3. deptUserData=<s:property value="deptUserData"/>;   
  4. </s:if>   
  5. //参与者树   
  6.     var tree = new Ext.tree.TreePanel({   
  7.         id: 'tree',   
  8.         onlyLeafCheckable: true,// 只对叶子节点可选   
  9.         animate: false// 动画效果   
  10.         rootVisible: false,   
  11.         autoScroll: true,   
  12.         disabled: false,   
  13.         width: 620,   
  14.         height: 300,   
  15.         //frame:true,   
  16.         border: true// 边框   
  17.         lines:true,   
  18.         //checkModel: 'single',   
  19.         loader: new Ext.tree.TreeLoader({   
  20.             baseAttrs: {   
  21.                 uiProvider: Ext.ux.TreeCheckNodeUI   
  22.             }   
  23.         }),   
  24.         renderTo:'assignTree',   
  25.         root: deptUserData   
  26.     });   
  27.   
  28.     tree.getRootNode().on('load',function(rootNode){       
  29.       rootNode.expand();      
  30.       for(var i = 0;i < checkedUsers.length;i++){     
  31.         tree.getNodeById(checkedUsers[i]).getUI().checkbox.checked=true;      
  32.       }      
  33.     });   
var deptUserData = [];
<s:if test="deptUserData!=null">
deptUserData=<s:property value="deptUserData"/>;
</s:if>
//参与者树
	var tree = new Ext.tree.TreePanel({
	    id: 'tree',
	    onlyLeafCheckable: true,// 只对叶子节点可选
        animate: false, // 动画效果
        rootVisible: false,
        autoScroll: true,
        disabled: false,
        width: 620,
        height: 300,
		//frame:true,
        border: true, // 边框
        lines:true,
        //checkModel: 'single',
        loader: new Ext.tree.TreeLoader({
			baseAttrs: {
			    uiProvider: Ext.ux.TreeCheckNodeUI
			}
		}),
	    renderTo:'assignTree',
	    root: deptUserData
	});

	tree.getRootNode().on('load',function(rootNode){    
	  rootNode.expand();   
	  for(var i = 0;i < checkedUsers.length;i++){  
	    tree.getNodeById(checkedUsers[i]).getUI().checkbox.checked=true;   
	  }   
	}); 


分享到:
评论

相关推荐

    Extjs动态树的实现以及节点拖拽

    在本文中,我们将探讨如何实现ExtJS动态树以及其中的节点拖拽功能。动态树是一种能够实时更新和修改的树形结构,允许用户添加、删除和移动节点。这种功能在各种应用场景中非常有用,如文件系统、组织结构或层级数据...

    Extjs 动态加载树

    动态加载树(Dynamic Loading Tree)是指在用户滚动或展开树节点时,仅加载当前需要显示的数据,而非一次性加载所有数据,这有助于提高页面性能和用户体验。 在描述中提到的博客链接可能提供了一个实现动态加载树的...

    extjs实现动态树

    3. 节点模型:每个树节点都是一个`Ext.data.Model`实例,包含节点属性如id、text、leaf等。 4. 数据绑定:使用`store`属性与数据源进行绑定,通过监听`load`事件实现异步加载。 二、动态加载 1. `rootVisible`:...

    extjs实现动态树加载菜单

    动态树加载菜单是 ExtJS 中一种常见且实用的功能,它允许用户在需要时按需加载树节点,从而提高应用性能,减少初次加载时的数据量。 动态树加载,也称为懒加载或按需加载,是指在用户滚动、展开节点或执行其他操作...

    Extjs 动态菜单、树节点的增删查改

    提供Extjs树的动态菜单生成,已及对树的增删查改该操作

    extjs 动态树及中文API

    4. `loader`:用于加载树节点的加载器对象,可以配置加载策略,如`loadMethod`用于指定加载数据的方法。 例如,一个基本的动态树配置可能如下所示: ```javascript var treeStore = Ext.create('Ext.data....

    Extjs4下拉树菜单ComboBoxTree支持单选和多选并且支持展开选中指定节点的通用控件

    在这个特定的情况下,我们讨论的是一个定制的下拉树菜单控件——ComboBoxTree,它在ExtJS4中实现了单选和多选功能,并且具备展开选中指定节点的能力。这个控件在实际项目中已经被广泛使用并证明了其稳定性和实用性,...

    EXTJS动态树支持checkbox 全选

    2. **数据模型**:定义树节点的数据模型(TreeModel或TreeNode),包含节点的属性,如文本、ID、子节点等。在动态加载场景下,数据模型通常包含加载子节点的方法或URL。 3. **复选框配置**:在树节点上添加复选框,...

    Extjs4动态树的实现

    监听器`select`会在用户选择树节点时触发,可以在这里添加处理用户选择的逻辑。 ```javascript var srzclbTreePanel = Ext.create('Ext.tree.Panel',{ store: knowlTreeStore, rootVisible: true, autoScroll: ...

    extjs动态树struts请求数据

    创建一个动态树,我们需要定义树节点的数据模型(TreeNode),配置数据源(store)以及视图配置(tree配置项)。 2. **JSON数据格式**: JSON (JavaScript Object Notation) 是一种轻量级的数据交换格式,易于人阅读...

    Extjs4 下拉树 TreeCombo

    当用户展开ComboBox时,内部的TreeView显示,用户可以浏览和选择树形结构中的节点。一旦用户选择了某个节点,ComboBox的输入框将显示所选节点的文本。 实现这个功能的关键步骤包括以下几个方面: 1. **设置ExtJS库...

    Extjs下拉多选树

    在ExtJS中,"下拉多选树"(Combobox Tree)是一种结合了下拉框和树形结构的组件,它允许用户在下拉菜单中选择多个树节点,提供了一种高效且直观的用户交互方式。 1. **下拉树组件**:在ExtJS中,树形组件...

    树形表格菜单 动态添加节点/动态删除节点/动态移动节点

    1.完整的包命名空间 2.自定义header footer 3.动态添加节点/动态删除节点/动态...15.支持插件开发,可以为树添加更多功能,例如下拉框树,选择框树,可编辑内容的树,拖动节点等都可以很容易自己实现或者根据第三方js实现

    Extjs 动态树 数据库

    动态树(Dynamic Tree)指的是在用户操作或特定事件触发时,通过异步请求加载树节点的数据。这种方式可以提高页面的加载速度,减少初次加载时的数据量。在ExtJS中,我们可以利用TreeStore和AjaxProxy来实现动态加载...

    extjs异步树-每个节点都异步加载-前后台代码都有-附整个工程

    在家研究了一下extjs异步树,-每个节点都异步加载-前后台代码都有-附整个工程-运行通过-前台代码请看doctree.js,后台代码请看TreeService.java,运行环境:Myeclipse6.5+tomcat7.0.27

    EXTJS动态树的实现举例

    其中,`MyTreeModel`应为预先定义好的Tree Model,用于描述树节点的结构。 4. Tree Model: Tree Model定义了树节点的数据结构,包括字段名、类型等。例如: ```javascript Ext.define('MyTreeModel', { ...

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

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

    extjs 树 搜索

    1. **树形数据结构**:EXTJS的树形控件基于JavaScript对象数组构建,每个节点代表一个对象,包含子节点、文本、图标等属性。例如,`{text: '节点1', children: [{text: '子节点1'}, {text: '子节点2'}]}`。 2. **...

    ExtJs4.2下拉树(修改版)

    ExtJs4.2没有直接提供下拉树这个组件,但是有例子可以用,文件位置:ext-4.2.1.883\examples\ux\TreePicker.js 但是它有点小毛病吧:默认显示了根节点;达到最小高度时再展开节点,高度不能自动调整。 所以我做了一...

    tree 动态树 extjs ajax

    4. **分页加载**:当树节点过多时,分批次加载,提高性能。 5. **搜索和过滤**:搜索树中的特定节点,或根据条件过滤显示。 6. **拖放功能**:允许用户通过拖放操作重新组织树结构。 7. **权限控制**:根据用户角色...

Global site tag (gtag.js) - Google Analytics