wijtree

The wijtree widget is a UI that presents items in a hierarchical tree structure. The wijtree widget supports expand/collapse animation and drag and drop functionality.

Open the .cshtml file for the View in which you want to display a tree. Add the following markup to create the tree:

<ul id="tree">
    <li><a>Tree Node 1</a>
              <ul>
                     <li><a>Tree Node 1a</a>
                     <li><a>Tree Node 1b</a>
            </ul>
      </li>
    <li><a>Tree Node 2</a></li>
 </ul>

To make the tree work, you need to initialize the widget. Add the following script to the .cshtml file:

<script id="scriptInit" type="text/javascript">
        $(document).ready(function () {
            $("#tree").wijtree();
            });
</script>

The script initializes the tree and specifies that it has two tree nodes and that one has two subnodes.

For more information about wijtree, click one of the externall links to view our Wijmo wiki documentation: