jQuery EasyUI Tree Menu - Creating a Basic TreeGrid
The TreeGrid component inherits from the DataGrid, but allows parent/child node relationships between rows. Many properties are inherited from the DataGrid and can be used in the TreeGrid. To use the TreeGrid, the user must define the 'treeField' property, specifying which field acts as the tree node.
This tutorial will show you how to set up a folder browser using the TreeGrid component.
Creating a TreeGrid
<table id="test" title="Folder Browser" class="easyui-treegrid" style="width:400px;height:300px"
url="data/treegrid_data.json"
rownumbers="true"
idField="id" treeField="name">
<thead>
<tr>
<th field="name" width="160">Name</th>
<th field="size" width="60" align="right">Size</th>
<th field="date" width="100">Modified Date</th>
</tr>
</thead>
</table>