码迷,mamicode.com
首页 > 其他好文 > 详细

通用列表数据转化为树形结构

时间:2017-07-15 19:56:41      阅读:133      评论:0      收藏:0      [点我收藏+]

标签:abc   parent   listt   个数   查找   push   fda   数据库   html   

近期做项目用的是JQuery  easyUI 控件, 尽管非常强大,可是高级控件对于数据的格式要求比較严格遇到 例如以下问题    



1.使用comboTree 控件   绑定树形的组织结构   可是 数据库查到的数据格式是 列表形式,并不符合  combotree的数据结构 以下是我的数据和  combotree 数据个对照


通用的数据结构   命名A

"[{"UnitID":"7cf57594a7074c46b94dcd6c985b0ced","UnitName":"总部","ParentUnitID":"-99","TreeLevel":null,"id":"7cf57594a7074c46b94dcd6c985b0ced","text":"总部"},{"UnitID":"fc29d1af54c728ccaf78ee15812c3eaa","UnitName":"三级门店","ParentUnitID":"0a2254a35212de01da189480569cdf13","TreeLevel":null,"id":"fc29d1af54c728ccaf78ee15812c3eaa","text":"三级门店"},{"UnitID":"0da0d3a6a0d899e6d639bfbf25005300","UnitName":"桥下店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"0da0d3a6a0d899e6d639bfbf25005300","text":"桥下店"},{"UnitID":"0a2254a35212de01da189480569cdf13","UnitName":"瓯海区郭溪镇塘下店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"0a2254a35212de01da189480569cdf13","text":"瓯海区郭溪镇塘下店"},{"UnitID":"dcd82e26bd432300431b0a4c42eb4265","UnitName":"瓯海区瞿溪店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"dcd82e26bd432300431b0a4c42eb4265","text":"瓯海区瞿溪店"},{"UnitID":"eb48732da7ba345ba43f45d56e598c56","UnitName":"新桥前花店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"eb48732da7ba345ba43f45d56e598c56","text":"新桥前花店"},{"UnitID":"180f37cb15ec30583715c4f5aefdee3a","UnitName":"瑞安塘下店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"180f37cb15ec30583715c4f5aefdee3a","text":"瑞安塘下店"},{"UnitID":"18222e0078bb880ffd969529ad04b7b2","UnitName":"瑞安虹桥","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"18222e0078bb880ffd969529ad04b7b2","text":"瑞安虹桥"},{"UnitID":"a3f7e62639abcbc3291289d17fed34a1","UnitName":"福鼎中汇广场店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"a3f7e62639abcbc3291289d17fed34a1","text":"福鼎中汇广场店"},{"UnitID":"7cfff1d71a4dc31fcfc9b9727248eb7e","UnitName":"鹿城区五马街店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"7cfff1d71a4dc31fcfc9b9727248eb7e","text":"鹿城区五马街店"},{"UnitID":"f2ce84effa9967e5d8612092bc7fa7a5","UnitName":"府前街店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"f2ce84effa9967e5d8612092bc7fa7a5","text":"府前街店"},{"UnitID":"9e4724093526ec481088adfa6ba59b8e","UnitName":"乐清市柳市1店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"9e4724093526ec481088adfa6ba59b8e","text":"乐清市柳市1店"},{"UnitID":"d87301409ee36db2d3adaeb68d99ae90","UnitName":"西城路店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"d87301409ee36db2d3adaeb68d99ae90","text":"西城路店"},{"UnitID":"515adc67314381b4a3ba5415a602daa9","UnitName":"龙湾区永中店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"515adc67314381b4a3ba5415a602daa9","text":"龙湾区永中店"},{"UnitID":"53fe0d947eca5a5ea4e2ff4a43093a9b","UnitName":"龙湾区状元店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"53fe0d947eca5a5ea4e2ff4a43093a9b","text":"龙湾区状元店"},{"UnitID":"c7afabeba4cb9e6755caa1c8fe261bb1","UnitName":"永嘉县上塘店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"c7afabeba4cb9e6755caa1c8fe261bb1","text":"永嘉县上塘店"},{"UnitID":"9b9c9d030a8853c3c5598c562d0ccc88","UnitName":"永嘉县瓯北楠江中路店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"9b9c9d030a8853c3c5598c562d0ccc88","text":"永嘉县瓯北楠江中路店"},{"UnitID":"195a6664931ecaa6ceb12ca42550f92d","UnitName":"永嘉县瓯北浦西街店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"195a6664931ecaa6ceb12ca42550f92d","text":"永嘉县瓯北浦西街店"},{"UnitID":"b3c3f0db2314f750139a7b8a0a19c28e","UnitName":"新桥店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"b3c3f0db2314f750139a7b8a0a19c28e","text":"新桥店"},{"UnitID":"e0d887bd105bf179f185f54a76783e97","UnitName":"安康店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"e0d887bd105bf179f185f54a76783e97","text":"安康店"},{"UnitID":"70df15625b031506dc5282b5ae49e614","UnitName":"乐清市柳市2店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"70df15625b031506dc5282b5ae49e614","text":"乐清市柳市2店"},{"UnitID":"46545a11490cafda35403819ae5a08ea","UnitName":"滨海利玛店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"46545a11490cafda35403819ae5a08ea","text":"滨海利玛店"},{"UnitID":"cdaef299c8dca8f56359d36ea5d2869a","UnitName":"南白象店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"cdaef299c8dca8f56359d36ea5d2869a","text":"南白象店"},{"UnitID":"d476d99dad3f8a8d34154cb17898d1ef","UnitName":"茶山店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"d476d99dad3f8a8d34154cb17898d1ef","text":"茶山店"},{"UnitID":"79598a8a8d86c32df23c21e4bc50692b","UnitName":"梅头店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"79598a8a8d86c32df23c21e4bc50692b","text":"梅头店"},{"UnitID":"d3cbb3c117814052fde5dc100ea44849","UnitName":"台州市椒江店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"d3cbb3c117814052fde5dc100ea44849","text":"台州市椒江店"},{"UnitID":"000c9b02717fb41a328056e562ad50ab","UnitName":"台州市路桥银座街店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"000c9b02717fb41a328056e562ad50ab","text":"台州市路桥银座街店"},{"UnitID":"7b0f03f7a6c139a2b50da0eadccb4df2","UnitName":"台州市路桥富仕路店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"7b0f03f7a6c139a2b50da0eadccb4df2","text":"台州市路桥富仕路店"},{"UnitID":"6012bfb1900e3618439c6171c163cfaf","UnitName":"鹿城区双屿店","ParentUnitID":"7cf57594a7074c46b94dcd6c985b0ced","TreeLevel":null,"id":"6012bfb1900e3618439c6171c163cfaf","text":"鹿城区双屿店"}]"


comboTree 要求符合的数据结构(这个数据结构是dome中的) 命名B

[{
"tid":1,
"text":"My Documents",
"children":[{
"tid":11,
"text":"Photos",
"state":"closed",
"children":[{
"tid":111,
"text":"Friend"
},{
"tid":112,
"text":"Wife"
},{
"tid":113,
"text":"Company"
}]
},{
"tid":12,
"text":"Program Files",
"children":[{
"tid":121,
"text":"Intel"
},{
"tid":122,
"text":"Java",
"attributes":{
"p1":"Custom Attribute1",
"p2":"Custom Attribute2"
}
},{
"tid":123,
"text":"Microsoft Office"
},{
"tid":124,
"text":"Games",
"checked":true
}]
},{
"tid":13,
"text":"index.html"
},{
"tid":14,
"text":"about.html"
},{
"tid":15,
"text":"welcome.html"
}]
}]


以下是将A转化为B的javascript 代码


 //rootParentIdValue      表示根节点的父类id 值是多少 如门店组织结构为-99
        //parentIdName    表示父类id的节点名称是什么    如门店组织结构的名称  ParentUnitID
        //nodeIdName    表示列表对象主键的名称  如门店是UnitID
        // listData 为二维的树形结构列表
    function listToTree(rootParentIdValue,parentIdName,nodeIdName,ListData){
            if(ListData instanceof Array&&ListData.length>0&&ListData[i][parentIdName]){
                //rootList 根节点集合  nodeList 子节点集合
                var rootList=[], nodeList=[],allChildren=[];
                // 分离出 根节点和子节点集合
                $.each(ListData,function(index,node){
                    node.id=node[nodeIdName];node.text=node.UnitName;//id  和text为 必须设置由于我遇到的问题是combotree绑定数据显示乱码 
                        if(node[parentIdName]==rootParentIdValue){
                            rootList.push(node);
                        }else{
                            nodeList.push(node);
                        }
                });
                //递归添加子节点 rootNodeList根节点集合。 //子节点集合  闭包结构
                function childrenNodeAdd(rootNodeList,childrenList){ 
                    //debugger;


                   if(childrenList.length>0){  //  假设没有子节点了结束递归

              //遍历根节点集合在 子节点中查找其自身的子节点并加入根节点相应的子节点
                       $.each(rootNodeList,function(index,rootNode){ //遍历全部子节点
                           rootNodeList[index]["children"]=[];
                           $.each(childrenList,function(childrenIndex,childrenNode){
                               
                                 if(parentIdName in childrenNode&&rootNode[nodeIdName]==childrenNode[parentIdName]){     //跟节点的id 等于子节点的父类id
                                     rootNodeList[index]["children"].push(childrenNode); //加入相应节点归为子节点
                                     allChildren.push(node);// 缓存全部已经加入过的对象


                                 }
                           });
                           var childrenNodeList=[] //一级节点加入完以后看是否还有剩余的子节点

                           //筛选器剩余的子节点
                           $.each(childrenList,function(childrenIndex,childrenNode) {
                             var  isAdd=true
                               $.each(allChildren,function(index,node) {
                                      if(node==childrenNode){
                                           isAdd=false
                                      }


                               });
                              if(isAdd){
                                  childrenNodeList.push(childrenNode);
                              }
                           });


                           childrenNodeAdd(rootNodeList[index]["children"],childrenNodeList);//剩余子节点继续递归运行 每次递归一次就表示节点添加一级。


                       })
                   }
                }
                debugger;
               if(nodeList.length>0&&rootList.length>0){      
                   childrenNodeAdd(rootList,nodeList);
                   return {isTree:false,Data:rootList,message:"转化完毕"}
               }else if(rootList.length>0){
                   return {isTree:false,Data:ListData,message:"没有相应的子节点集合"}
               }else{
                   return {isTree:false,Data:ListData,message:"没有相应的父类节点集合"}
               }


            }else{
                return {isTree:false,Data:ListData,message:"格式不对,无法转换"}
            }
        },


树形转化为列表的代码有兴趣的人能够开发一下。

假设有问题请联系1015003209

注意combotree  绑定数据中文easy产生undefined  解决方式就是将   我们查询出来的id字段名称    用id 取代。显示的文字用text  我的代码就是  id取代了UnitID text取代了UnitName  详细原因限制未知。 英文无此类问题。



通用列表数据转化为树形结构

标签:abc   parent   listt   个数   查找   push   fda   数据库   html   

原文地址:http://www.cnblogs.com/jzdwajue/p/7183853.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!