你的位置:首页 > Java教程

[Java教程]javascript将行结构数据转化为树形结构数据


js接收到后台的数据如下

 1 /// 部门信息 2 var departRows = [{ 3   parentDepartId: 'root', 4   departId: 'DC', 5   departName: '地产集团' 6 }, { 7   parentDepartId: 'DC', 8   departId: '01', 9   departName: '上海地产本部'10 }, {11   parentDepartId: 'DC',12   departId: '02',13   departName: '中华企业'14 }, {15   parentDepartId: '02',16   departId: '0200',17   departName: '中华企业股份有限公司本部'18 }, {19   parentDepartId: '02',20   departId: '0201',21   departName: '上海古北(集团)有限公司'22 }, {23   parentDepartId: '0201',24   departId: '020100',25   departName: '上海古北(集团)有限公司本部'26 }, {27   parentDepartId: '0201',28   departId: '020101',29   departName: '上海古北顾村置业有限公司'30 }, {31   parentDepartId: '0201',32   departId: '020102',33   departName: '上海古北京宸置业发展有限公司'34 }, {35   parentDepartId: '0201',36   departId: '020103',37   departName: '苏州洞庭房地产发展有限公司'38 }];

View Code

通常我们所使用的一些tree插件是无法直接解析上边这种数据源的,那么我们怎么将行结构的数据转化为树形结构数据,提供给easyui、extjs等tree一系列控件使用呢?

 1 /// 属性配置 2 var attributes = { 3   // 标识字段名 4   keyField: 'departId', 5   // 上级标识字段名 6   parentKeyField: 'parentDepartId', 7   // 文本字段名 8   textField: 'departName', 9   // 根节点标识10   rootKey: 'root'11 }12 13 /// <summary>14 /// 行格式数据转化为tree格式数据15 /// </summary>16 /// <param name="rows">rows格式数据</param> 17 /// <param name="attributes">属性信息</param> 18 function convertTreeData(rows, attributes) {19   var keyNodes = {}, parentKeyNodes = {};20   for (var i = 0; i < rows.length; i++) {21     var row = rows[i];22     row.id = row[attributes.keyField];23     row.parentId = row[attributes.parentKeyField];24     row.text = row[attributes.textField];25     row.children = [];26 27     // Id对应节点28     keyNodes[row.id] = row;29 30     // ParentId对应子节点31     if (parentKeyNodes[row.parentId]) { parentKeyNodes[row.parentId].push(row); }32     else { parentKeyNodes[row.parentId] = [row]; }33 34     // 将子节点集合添加到当前节点下35     var children = parentKeyNodes[row.id];36     if (children) { row.children = children; }37 38     // 将当前节点添加到父级下39     var pNode = keyNodes[row.parentId];40     if (pNode) { pNode.children.push(row); }41   }42   return parentKeyNodes[attributes.rootParentId];43 }

View Code

调用方法

1 var treeData = convertTreeData(departRows, attributes);

View Code