下拉Tree 与 递归的使用

//下拉Tree

//网上下载tree  js css文件

// 动态加载js css,  tree html,  event

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39

//下拉菜单tree var BootStrapTextTree = {     textID: ""     //下拉树     , onLoadScriptAndCss: function () {         //动态加载js         $.getScript('../Content/Bootstrap/bootstrap-3.3.7-dist-new/bootstrap-treeview/bootstrap-treeview.js');         //动态加载css         $("head").append("<link>");         var css = $("head").children(":last");         css.attr({ rel: "stylesheet", type: "text/css", href: "../Content/Bootstrap/bootstrap-3.3.7-dist-new/bootstrap-treeview/bootstrap-treeview.min.css" });     }     , onLoad_Text_Tree: function (txtid) {         textID = txtid;         //加载html         var html = "<div class='form-group' style='width:100%;'>"                     + "<div class='btn-group' role='group' style='width:100%;'>"                      + "<input id='" + txtid + "' class='form-control' name='selectCatalog' type='text' autocomplete='off' onclick=\"$('#div_TextTree').show();$(this).blur();\">"                       + "<div id='div_TextTree' style='height:200px;overflow: auto;display:none;position: absolute;width: 100%;'></div>"                       + "</div>"                      + "</div>";         //返回html         return html;     }     , bindFun: function (_data) {         $("#" + textID).click(function () {             _data = ConvertTreeData(_data);             var options = {                 levels: 1,                 data: _data,                 onNodeSelected: function (event, data) {                     $("#" + textID).val(data.text);                     $("#div_TextTree").hide();//选中树节点后隐藏树                 }             };             jq1124('#div_TextTree').treeview(options);         });     } };

//Tree   需要的数据  格式为 :

//[{ id: "1", text: "1#LF高压室", nodes: [{ id: "2", text: "aaa" }, { id: "3", text: "bbb" }] }, { id: "4", text: "aaaaaaaa", nodes: [{ id: "5", text: "aaa" }, { id: "6", text: "bbb" }] }];

//但是数据通过sql查出来的格式为：

//[{ Id: "1", name: "aaa", parentId: "0" }, { Id: "2", name: "bbb", parentId: "1" }, { Id: "3", name: "ccc", parentId: "2" }, { Id: "4", name: "ddd", parentId: "2" }];

//sql:　

?

1 2 3 4 5 6 7

WITH TEMP AS( SELECT AreaID, AreaName, ParentID FROM t_CM_Area WHERE AreaID =54--最高父级id UNION ALL SELECT B.AreaID, B.AreaName, B.ParentID FROM TEMP A INNER JOIN t_CM_Area B ON B.ParentId = A.AreaID) SELECT AreaID, AreaName, ParentID FROM TEMP

//需要对上面的数据进行转换使用

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

function ConvertTreeData(_array) {     var result = [];     for (var j = 0; j < _array.length; j++) {         _array[j].nodes = [];         _array[j].text = _array[j].name;         if (_array[j].parentId == "0") {//从哪里开始组织下的数据             Recursion(_array[j]);             result.push(_array[j]);         }     }     function Recursion(obj) {         for (var i = 0 ; i < _array.length ; i++) {             if (_array[i].parentId == obj.id) {                 var b = { id: _array[i].id, text: _array[i].name, nodes: [] };                 obj.nodes.push(b);                 Recursion(b, _array);             }         }     }     return result; }