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
原标题:javascript将行结构数据转化为树形结构数据
关键词:JavaScript