前台JS
Ext.onReady(function(){
var treeLoader = new Ext.tree.TreeLoader({
dataUrl:'../servlet/basic?action=treePanelTest',
listeners:{
beforeload:function(treeLoader,node){
alert(node.attributes.id);
treeLoader.baseParams.parentID = node.attributes.id;
//将AsyncTreeNode中的id传给变量parentID,然后交个Servlet处理
}
}
});
var form = new Ext.tree.TreePanel({
renderTo:'hello',
root: new Ext.tree.AsyncTreeNode({id:'-1',text : '根节点'}),
rootVisible:true,//判断根节点是否显示
loader:treeLoader
});
});
后台Servlet:
JSONArray array = new JSONArray();
JSONObject json;
if ("-1".equals(req.getParameter("parentID"))) {
List<Company> list = CompanyService.getAllCompanyList();
for (Company company : list) {
json = new JSONObject();
json.accumulate("id", company.getId());
json.accumulate("text", company.getName());
json.accumulate("leaf", false);
array.add(json);
}
} else {
long parentID = Long.parseLong(req.getParameter("parentID"));
Company company = CompanyService.findCompanyByID(parentID);
for (Company dept : company.getDepartments()) {
json = new JSONObject();
json.accumulate("id", dept.getId());
json.accumulate("text", dept.getName());
json.accumulate("leaf", false);
array.add(json);
}
for (User user : company.getStaff()) {
json = new JSONObject();
json.accumulate("id", user.getId());
json.accumulate("text", user.getUserName());
json.accumulate("leaf", true);
array.add(json);
}
}
String retJSON = array.toString();
分享到:
相关推荐
在EXT中,遍历TREE通常通过遍历TREE节点来完成,这可以通过EXT的API来实现。例如,可以使用`treePanel.getRootNode()`获取树的根节点,然后递归或循环遍历其子节点。如果`example4.js`中定义了这样的函数,那么这...
由于Checkbox Tree支持多级节点,因此在处理全选/全不选或者级联选中时,需要使用递归算法遍历所有子节点,同步它们的选中状态。 9. **样式和模板**: 复选框的样式可以通过CSS自定义,如改变选中、未选中和三态...
在本篇文章中,我们将深入探讨如何在ExtJS框架中获取TreePanel中所有被选中(checked)的叶子节点的ID。此技术对于处理复杂的数据结构、优化用户交互体验以及实现高效的数据管理至关重要。 ### 一、ExtJS简介 ...
当树形组件结合复选框时,可以实现用户对节点的选择操作,如全选、反选、子选父以及父选子。这些功能在数据管理、权限分配等场景中非常实用。 首先,我们要理解ExtJS树形组件的基本构造。一个树形组件由节点(Nodes...
6. 递归函数的运用:在示例代码中,使用了node.cascade()函数递归地遍历和更新节点的复选状态。这是一个非常有用的函数,可以用于递归处理树节点及其子节点的属性。 7. 树节点的渲染和显示:示例中提到了Fpanel....
- **cascade(fn, scope, args)**: 从当前节点开始向下遍历并调用指定函数。 - **contains(node)**: 判断当前节点是否包含指定的子节点。 - **eachChild(fn, scope, args)**: 遍历当前节点的所有子节点并调用指定...
- `cascade(fn, [scope], [args])`: 从当前节点开始向下遍历调用指定函数,如果函数返回false则停止。 - `contains(node)`: 检查当前节点是否包含指定的子节点。 - `eachChild(fn, [scope], [args])`: 遍历当前...
- 在服务器端(例如Java的`TreeAction.java`),我们需要遍历数据库或其他数据源,生成符合树结构的JSON对象。这通常涉及递归调用,因为每个节点可能有无限数量的子节点。JSON结构通常包含节点ID、文本、父节点ID...
在ExtJS中,"下拉多选树"(Combobox Tree)是一种结合了下拉框和树形结构的组件,它允许用户在下拉菜单中选择多个树节点,提供了一种高效且直观的用户交互方式。 1. **下拉树组件**:在ExtJS中,树形组件...
在这个场景下,我们将讨论如何将EXTJS的Tree组件与Java的Structs概念结合,以创建一个美观且功能强大的导航界面。 EXTJS的Tree组件允许开发者通过JSON或XML数据源动态加载树节点。每个节点可以包含子节点,形成层级...
本教程将详细讲解如何在SSH(Spring、Struts2、Hibernate)框架下,结合ExtJS库和JSON数据格式来实现这一功能。 首先,SSH框架是一个流行的企业级Java Web开发框架,Spring负责管理对象,Struts2处理请求与响应,...
在EXTJS中,"树"(Tree)是一种常见的UI组件,常用于展现层次结构的数据。 标题中的“EXTJS动态树支持checkbox全选”指的是EXTJS中树组件的一个特性,即在树形结构中添加复选框(checkbox)功能,并支持全选和全...
1. **递归调用的终止条件**:在遍历子节点的过程中,需要确保递归调用有一个清晰的终止条件,避免无限循环。 2. **性能考虑**:对于大型数据集,频繁地触发`checkchange`事件可能会导致性能下降。可以通过适当优化...
这需要递归地遍历树结构,更新相关节点的状态。 4. **事件处理**:用户点击复选框时,会触发事件,这个事件可能包含节点的新状态,以及当前选中或取消选中的节点信息。这些事件可以被其他部分的代码监听,用于执行...
- 通过循环遍历数据集的每一行,构建符合前端期望格式的JSON字符串。 #### 五、总结 本文详细介绍了如何使用ExtJS中的`Ext.ux.tree.TreeGrid`组件实现异步加载功能,包括前端配置和后端数据处理两个方面。通过这种...
3. **构建节点**:遍历列表中的每个元素,为每个元素创建 `TreeCell`、`TreeRow` 和 `TreeItem` 对象,并设置它们之间的父子关系。 4. **添加到树**:根据节点的父节点情况将其添加到树的不同位置。 #### 定义树 在...
EXTJS Tree提供了丰富的API,包括遍历树、查找节点、添加/删除/更新节点、展开/折叠节点等方法,方便开发者进行动态操作和数据管理。 9. **响应式设计**: EXTJS Tree也支持响应式布局,可以根据屏幕尺寸自动调整...
创建树形结构使用了`Ext.tree.Panel`,并配置了`rootVisible : false`来隐藏根节点,以及`border : false`去除边框。数据源来自`Ext.data.TreeStore`,它的根节点是动态加载的,数据来自于服务器响应。`'itemclick'`...
它能够通过异步加载或一次性加载数据,支持节点的展开、折叠、选择以及拖放操作。TreeSelector将这个树面板与一个选择器界面结合起来,使得用户可以方便地浏览和选择树中的项。 **主要知识点:** 1. **Tree ...