本節課重點了解 EasyUI 中 TreeGrid(樹形表格)組件的使用方法，這個組件依賴於
DataGrid(數據表格)組件
一． 加載方式
//建立一個 JSON 文件
[{
"id" : 1,
"name" : "系統管理",
"date" : "2015-05-10",
"children" : [{
"id" : 2,
"name" : "主機信息",
"date" : "2015-05-11"
}]
}, {
"id" : 3,
"name" : "會員管理",
"date" : "2015-05-10",
"children" : [{
"id" : 4,
"name" : "認證審核",
"date" : "2015-05-11"
}]
}]
//class 加載方式
<table class="easyui-treegrid" style="width:380px;height:150px"
data-options="url:'treegrid.json',idField:'id',treeField:'name'">
<thead>
<tr>
<th data-options="field:'name',width:180">菜單名稱</th>
<th data-options="field:'date',width:180">創建時間</th>
</tr>
</thead>
</table>
//JS 加載方式
<table id="box" style="width:380px;height:150px;"></table>
$('#box').treegrid({
url : 'treegrid.json',
idField : 'id',
treeField : 'name',
columns : [[
{
title : '菜單名稱',
field : 'name',
width : 180,
},
{
title : '創建時間',
field : 'date',
width : 180,
}
]],
});
二． 屬性列表
樹形表格擴展自 datagrid(數據表格)，樹形表格新增的屬性如下：
方法和 DataGrid 一致，不在重復！略。
三． 事件列表
樹形表格的事件擴展自 datagrid(數據表格)，樹形表格新增的時間如下：
四． 方法列表
很多方法都使用'id'命名參數，而'id'參數代表樹節點的值
