Using a TreeView widget to display a directory structure
A TreeView widget can be created by specifying the hierarchical data either in the HTML markup or by binding it to a DataSource
object.
How to do it…
To create a TreeView, let's specify the data in the markup, as shown in the following code snippet:
<ul id="treeView"> <li> Directory1 <ul> <li>File1.txt</li> <li>File2.txt</li> </ul> </li> <li> Directory2 <ul> <li>File3.txt</li> <li>File4.txt</li> </ul> </li> <li> Directory3 <ul> <li>File5.txt</li> <li>File6.txt</li> </ul> </li> </ul>
The next step is to initialize the TreeView widget by invoking the kendoTreeView
function on the DOM node using the following line of code:
$('#treeView').kendoTreeView();
How it works…
The TreeView widget...