天天看點

樹的裁據表_jquery的tree table(樹表)

因項目需要,需要在表格中加入tree,使用了jquery的tree table,經美化,完美相容各種架構的table;

請移步下載下傳tree table 的js檔案及css檔案等,http://ludo.cubicphuse.nl/jquery-treetable/;

用到css檔案:

用到js檔案:

使用示例:

Parent
Child

data-tt-id為2的tr 通過data-tt-parent-id指向1節點,意思就是第二個tr是第一個tr的子節點;

一行js搞定,$("#tableId).treetable({expandable : true});

層級複雜的表格通過背景遞歸查詢查出資料list後,可以通過判斷該節點是否具有父節點來給tr增加parent_id,看示例:

var trArr = $("#tableId tr");

for (var i = 0; i < trArr.length; i++) {

$("#tableId tr:eq(" + i + ")").attr(

"data-tt-id", tabledate[i].orgId);

if (tabledate[i].parentOrg != '') {

$("#tableIdtr:eq(" + i + ")").attr(

"data-tt-parent-id", tabledate[i].parentOrg);

}

}