bootstrap Treeview 树形结构 无限极二维数组层级关系

 1 private function getarea(){
 2     $post_data = array();
 3     $result = $this->send_post('请求数据地址/?msgid=121&authkey=webuser&accountid='.$_session['id'].'&projectid='.$_session['projectid'].'',$post_data);
 4     $volist = json_decode($result,true);
 5     
 6     // 这一段应该是很通俗的，就是构建一个新的数组，新数组的key值是自己的主键id值进行完这一步之后  这步很重要
 7     $items = array();
 8     foreach($volist['regions'] as $v){
 9         $items[$v['id']] = $v;
10     }
11    
12       
14 
15     
16     # 第一步先简化数组 只要直接想要的几个字段   我这里需要 不需要的可以不用
17     $newdata = array();
18     foreach($items as $ke=>$it){
19         $newdata[$ke]['id'] = $it['id'];
20         $newdata[$ke]['text'] = $it['name'];
21         $newdata[$ke]['parentid'] = $it['parentid'];
22         $newdata[$ke]['projectid'] = $it['projectid'];
23         $newdata[$ke]['projectname'] = $it['projectname'];
24     }
25 
26     # 第二步 
27     # 先找到这个新数组中有没有这个key 如果没有 
28     $tree = array();
29     foreach($newdata as $k => $item){
30         // 其实这里 "$newdata[$item['parentid']]" 就是newdata的下标,上面已经把每条信息的 id改成了自己的key  因为id= parentid
31         // 找到原数组 中上下关系字段 如果是0 肯定是false 则就是*
32         if(isset($newdata[$item['parentid']])){
33             $newdata[$item['parentid']]['nodes'][] = &$newdata[$k];  
34             // 若不为真 把这条数据拿到key等于这条数据的parentid的下面 自定义下标名称并且多加一个"[]"万一这个id下面的子类有多个
35         }else{
36             $tree[] = &$newdata[$k];  // *
37         }
38     }
39     echo json_encode($tree);
40 }

// 结果  我这里数据有点少 但是基本上看的清楚 如果还有 子类 孙子类 都会追加到相应的父类后面

 1 
 2 array(3) {
 3   [0] => array(6) {
 4     ["id"] => int(49)
 5     ["text"] => string(12) "车身车间"
 6     ["parentid"] => int(0)
 7     ["projectid"] => int(16)
 8     ["projectname"] => string(12) "南京大通"
 9     ["nodes"] => array(1) {
10       [0] => array(5) {
11         ["id"] => int(75)
12         ["text"] => string(3) "456"
13         ["parentid"] => int(49)
14         ["projectid"] => int(16)
15         ["projectname"] => string(12) "南京大通"
16       }
17     }
18   }
19   [1] => array(6) {
20     ["id"] => int(50)
21     ["text"] => string(12) "冲压车间"
22     ["parentid"] => int(0)
23     ["projectid"] => int(16)
24     ["projectname"] => string(12) "南京大通"
25     ["nodes"] => array(1) {
26       [0] => array(5) {
27         ["id"] => int(78)
28         ["text"] => string(3) "666"
29         ["parentid"] => int(50)
30         ["projectid"] => int(16)
31         ["projectname"] => string(12) "南京大通"
32       }
33     }
34   }
35   [2] => array(5) {
36     ["id"] => int(82)
37     ["text"] => string(12) "总装车间"
38     ["parentid"] => int(0)
39     ["projectid"] => int(16)
40     ["projectname"] => string(12) "南京大通"
41   }
42 }

 

 

前台展示

1 <link rel="stylesheet" type="text/css" href="css/pagination.css" media="screen">
2 <div class="ibox-content" style="height:500px">
3     <div id="treeview5" class="test"></div>
4 </div>

 

 1 // 活数据 页面只需引入js
 2 <script src="js/plugins/treeview/bootstrap-treeview.js"></script>    
 3 # 页面显示 ajax获取转换后的数据
 4 var defaultdata='';
 5 $(function () {
 6     $.ajax({
 7         type: 'post',
 8         url: '__url__/getarea',
 9         async: false,
10         datatype: 'json',
11         success: function (d) {
12             defaultdata = d;
13         }
14     });
15 
16     
17     # 显示在指定位置
18     $('#treeview5').treeview({
19         levels: 4,　　　　　　// 这里设置树形结构 默认展开几层
20         color: "#428bca",
21         expandicon: 'glyphicon glyphicon-chevron-right',
22         collapseicon: 'glyphicon glyphicon-chevron-down',
23         nodeicon: '',
24         showtags: false,
25         data: defaultdata,
26     });
27 });

效果: 图一开始忘记上了 后加的!效果就是这个效果