$('#material').treegrid({
nowrap: false,
rownumbers: true,
animate:true,
collapsible:true,
loadMsg:'数据加载中请稍后……',
url:'<c:url value="/jxc/sysinfo/loadMaterialTree.jsps"/>',
idField:'matCode',
treeField:'matCode',
frozenColumns:[[
{title:'料号',field:'matCode',width:180}
]],
columns:[[
{field:'matType',title:'产品类型',width:120},
{field:'matShow',title:'产品名称',width:120},
{field:'matStandard',title:'产品规格',width:120},
{field:'matProperties',title:'产品属性',width:120}
]],
onBeforeLoad:function(row,param){
// 此处就是异步加载地所在
if (row){
$(this).treegrid('options').url = '<c:url value="/jxc/sysinfo/loadMaterialTree.jsps"/>?matParentId='+row.matId;
} else {
$(this).treegrid('options').url = '<c:url value="/jxc/sysinfo/loadMaterialTree.jsps?matName="/>';
}
},
onClickRow:function(){
/**
** 如果是新建或者修改,以及删除,则清除查询form表单数据
**/
$('#materialSearch').form('clear');
}
});
<table id="material"></table>
以及树的异步添加、删除、刷新等
请参考: http://jquery-easyui.wikidot.com/document:treegrid
分享到:
相关推荐
在EASYUI TreeGrid中,异步加载数据是一项重要的功能,允许用户在需要时动态获取数据,提高应用的性能和用户体验。 异步加载数据通常涉及到以下几个关键点: 1. **配置URL**:在TreeGrid的初始化参数中,`url`属性...
通过以上步骤,我们可以实现EasyUI TreeGrid组件根据查询条件动态加载数据的功能。这种方式避免了对`treegrid('reload')`方法的直接依赖,同时也符合异步数据处理的最佳实践。在实际开发中,根据项目需求,你可能还...
EasyUI TreeGrid支持`onExpand`事件,可在事件回调中异步加载子数据。 4. **JavaScript配置**: 在JavaScript中,我们需要初始化TreeGrid并配置相关参数,如加载数据的方式、列定义等: ```javascript $('#...
1. **异步加载树结构**: 异步树结构主要应用于那些数据量大或者层级深的场景,避免一次性加载所有节点导致页面卡顿。EasyUI 提供了两种主要的异步树组件:`combotree` 和 `treegrid`。 2. **Combotree(树形...
这里面包含easyui的chm文档easyui-1.3.5.zip,datagrid项目案例,SSH和easyui整合的案例,easyui异步加载tree,tree和datagrid共用的例子,改好的兼容jQueryUI1.10.3的easyui,另外加一个primeui-10资料。资源分定为1分...
这通常通过配置`onBeforeOpen`事件来实现,当用户展开一个节点时,该事件会被触发,此时可以异步获取子节点数据并添加到TreeGrid中。 4. 分页与排序:为了提高性能,TreeGrid可以结合后台分页功能,只加载当前页的...
在本资料包 "EasyUI 的功能树之异步树 JAVA 版本.zip" 中,主要讨论的是如何在 JAVA 后端与 EasyUI 前端配合,实现异步加载的数据树功能。 数据树是一种常见的 UI 控件,用于展示层次结构的数据,如组织架构、文件...
EasyUI Tree 支持异步加载数据,这意味着树节点可以按需动态加载,而不是一次性加载所有数据。这种特性对于处理大量数据或网络延迟的情况非常有用,因为它降低了初次加载页面时的数据量。 2. **配置与属性**: 在...
通过上述后端和前端代码的配合,就可以实现一个基于Jquery EasyUI tree组件的异步加载树,这个树能够根据指定文件夹内的文件和子文件夹动态生成。 总结而言,通过Jquery EasyUI的tree组件,开发者可以方便地构建...
easyUI 创建异步Tree easyUI 附加tree节点到tree easyUI 创建Tree和复选框Tree Node easyUI 拖动(Drag)和放置(Drop)Tree easyUI 加载parent/child节点到tree 转换tree标准格式数据 easyUI 创建一个基础的...
可以查询根节点和具体子节点的信息,开始使用EasyUI的TreeGrid的loadData 加载url的方式不能实现查询功能,于是利用异步AJAX查询了一下数据返回后,赋值给变量,然后利用 TreeGrid的loadData加载这个json格式的返回...
1. **组件库**:EasyUI包含了一系列可复用的UI组件,如`datagrid`(数据网格)、`treegrid`(树形数据网格)、`form`(表单)、`dialog`(对话框)、`tabs`(选项卡)、`menu`(菜单)、`splitter`(分割器)等。...
API中包含如何创建树节点、展开折叠、异步加载等内容。 4. **Dialog**: 对话框组件提供了一种弹出式窗口,用于显示信息或进行交互。API中涵盖了如何打开、关闭、设定尺寸、位置以及添加按钮等功能。 5. **Form**: ...
树的节点可以关联到数据模型的实例,通过异步加载或预加载数据。EasyUI的`treegrid`组件可以同时展示树状结构和表格数据,更便于操作。 6. **窗口(window)分类**:EasyUI的`window`组件用于弹出对话框,通常用于...
在EasyUI中,可以使用TreeGrid或Tree组件来实现权限树,通过异步加载数据提高用户体验。 3. **角色分配(Role Assignment)**:用户可以被指派一个或多个角色,这决定了用户能访问哪些资源和执行哪些操作。在后台...
1. **组件丰富**:EasyUI 提供了大量预先封装好的组件,如 DataGrid(数据网格)、TreeGrid(树形数据网格)、Combobox(组合框)、Dialog(对话框)等,大大减少了开发者自定义界面的工作量。 2. **响应式设计**:...
7. **异步数据加载**:EasyUI 支持 AJAX 技术,可以通过 JSONP 或其他方式从服务器动态加载数据,实现页面的实时更新和无刷新操作。 8. **事件处理**:EasyUI 的组件都支持绑定事件,如点击、改变等,开发者可以...
学习如何使用 `datagrid` 或 `treegrid` 的 `url` 属性来加载远程数据,以及如何使用 `onLoadSuccess` 和 `onClickRow` 等事件处理函数进行数据交互。 4. **样式和主题**:EasyUI 提供了多种预定义的主题,学习如何...
4. **数据绑定**:EasyUI通过`datagrid`、`treegrid`等组件与后端进行数据交互,支持JSON、XML等多种数据格式,以及Ajax异步加载。 5. **事件处理**:每个组件都有丰富的事件,如点击、展开、关闭等,开发者可以...