$.fn.treegrid.defaults.loadFilter = function (data, parentId) { var opt = $(this).data().treegrid.options; var idFiled, parentField; if (opt.parentField) { idFiled = opt.idField; parentField = opt.parentField; var i, l, treeData = [], tmpMap = []; for (i = 0, l = data.length; i < l; i++) { tmpMap[data[idFiled]] = data; } for (i = 0, l = data.length; i < l; i++) { if (tmpMap[data[parentField]] && data[idFiled] != data[parentField]) { if (!tmpMap[data[parentField]]['children']) tmpMap[data[parentField]]['children'] = []; tmpMap[data[parentField]]['children'].push(data); } else { treeData.push(data); } } return treeData; } return data; };
使用方法,放到公共的JS文件里面。在配置TREE或者TREEGRID的时候,如下三个属性必备:
idField: 'tp_id',//子菜单字段名
treeField: 'tp_name',//显示的字段名
parentField: 'tp_parent',//父菜单字段名
其它的直接参照文档配置就OK了。
相关推荐
{name: '上海分部', id: 2, pid: 0, children: []}, {name: '成都分部', id: 3, pid: 0}, {name: '广州分部', id: 4, pid: 0}, {name: '沈阳分部', id: 5, pid: 0}, {name: '张三', id: 6, pid: 0, isLeaf: ...
在上面的代码中,我们使用`tree.render()`方法初始化下拉树,`data`参数是我们模拟的树数据,每个对象包含`id`(节点ID)、`pid`(父节点ID)和`name`(节点文本)。`click`回调函数会在节点被点击时触发,更新表单...
EasyUI Tree插件是基于jQuery的一个轻量级插件,它提供了一种简单的方式创建树形控件。然而,在实际应用中,我们常常遇到数据结构的问题——即如何处理带有`children`属性的嵌套数据结构。这篇文章将详细介绍如何对...
其实原理就是和树的数据存在数据库中一样,是一行行存储的,每一行有自己的id和parentId(PID)即可。 如何使用: var $tree = $('#treePanel'); var treeObj = $tree.treeMode({ flatData : flat, ...
{ id: 1, pId: 0, name: "父节点1" }, { id: 2, pId: 1, name: "子节点1" }, { id: 3, pId: 1, name: "子节点2" } ]; ``` 接下来,我们来看看JSTree。JSTree同样是一款强大的树形视图插件,支持多种数据源,包括...
在这个例子中,`setting`对象定义了JStree的行为,`data.simpleData`部分用于启用简单数据模式,使我们能够直接使用上面的JSON数据。`$("#treeDemo")`是我们之前创建的HTML元素的选择器。 JStree还提供了丰富的事件...
每个正在运行的进程在`/proc`下都有一个对应的数字目录,如`/proc/1234`,其中1234是进程ID(PID)。这些目录下包含多个文件,如`status`、`cmdline`等,它们分别存储了进程的状态、命令行参数等信息。 在`/proc/...
基于aceadmin1.4编写,其它版本稍做改动即可使用,需要先引入aceadmin相应的tree.min.js,使用时只需要传入带id、pId的json数组,自动生成上下级多层关系的树,可直接从后端取数返回json,引入此js后,调用:aceTree...
在给定的标题和描述中,“pid”通常指的是“parent id”,它用于表示一个元素的父级节点。本篇文章将深入探讨如何使用JavaScript将一个包含pid的数组转换为树形结构。 首先,我们来理解一下基本概念。一个数组中的...
每个`<li>`元素代表一个树节点,可以通过`data-id`、`data-pid`等自定义属性存储节点的标识和其他信息。 2. **展开与折叠**: layui tree通过CSS类`layui-tree-collapse`来控制节点的展开与折叠状态。当节点被折叠...
标题中的“Synopsis支持跨平台展示PID子节点列表”指出,这个软件包主要功能是提供一个跨平台的解决方案,用于展示进程ID(PID)的子节点结构。在操作系统中,PID是每个运行进程的唯一标识符,而子节点通常指的是由...
* PId:外键,用于关联到自身的父节点 * MenuName:节点的名称 * Url:节点的 URL * OrderNum:节点的顺序号 * SonCount:节点的子节点数量 2. 在页面加载时,我们首先加载顶级节点,并将其设置为闭合状态...
Delphi实现的树控菜单Tree源码,DbTree.pas单元实现了TreeView与数据的关联,其各项要求如下: 数据库这里采用了ADOQuery,表中的字段要有id,pid,caption一个。 id:为自增字段,用于表示节点的编号。 pid...
1. **数据结构**:z-tree的数据是以JSON格式存储的,每个节点包含ID、父ID、名称等基本信息,以及可选的子节点数组,形成一个树状的数据结构。例如: ```json [ { "id": 1, "pId": 0, "name": "父节点1", ...
pIdKey: "pId", // 父节点ID字段 rootPId: 0 // 根节点的父ID值 } }, }; var zNodes = [ { id:1, pId:0, name:"父节点1"}, { id:11, pId:1, name:"子节点1-1"}, { id:12, pId:1, name:"子节点1-2"} ]; $.fn...
dTree.prototype.add = function(id, pid, name, url, title, target, icon, iconOpen, open) { // ... }; ``` #### xTree ##### 1. 简介 与`dTree`相比,`xTree`提供了更多的功能,例如支持动态增加或删除树...
tree 根据java的引用特性获取树形json,避免使用递归算法 原始数据: {"id":1,"name":"树节点1","pId":0} {"id":2,"name":"树节点2","pId":1} {"id":3,"name":"树节点3","pId":1} {"id":4,"name":"树节点4","pId":2} {...
{ id:1, pId:0, name:"父节点1" }, { id:2, pId:1, name:"子节点1" }, { id:3, pId:1, name:"子节点2" } ]; ``` 3. **初始化zTree**:在jQuery的$(document).ready()中,调用$.fn.zTree.init方法初始化树。 ```...
{ id:1, pId:0, name:"父节点1", open:true }, { id:2, pId:1, name:"子节点1" }, { id:3, pId:1, name:"子节点2" } ]; ``` ### 4. 主要API - `treeObj.reAsyncChildNodes(node, reloadType, isSilent)`: 异步...