Implementing IEnumerable on a tree structure

Question

Based on the work of these guys:

dvanderboom.wordpress.com/2008/03/15/treet-implementing-a-non-binary-tree-in-c/ www.matthidinger.com/archive/2009/02/08/asp.net-mvc-recursive-treeview-helper.aspx

I am trying to implement a TreeView helper that would be used as such:

<%= Html.TreeView("records", 
                  Library.Instance.Records, 
                  r => r.Children, 
                  r => r.ID) %>

And the tree structure is defined like this:

public class Tree<T> : TreeNode<T> where T : TreeNode<T>
{ }


public class TreeNode<T> : IDisposable where T : TreeNode<T>
{
    public T Parent { get; set; }
    public TreeNodeList<T> Children { get; set; }
}


public class TreeNodeList<T> : List<TreeNode<T>> where T : TreeNode<T>
{
    public T Parent;

    public T Add(T node)
    {
        base.Add(node);
        node.Parent = (T)Parent;
        return node;
    }

    public void Remove(T node)
    {
        if (node != null)
            node.Parent = null;
        base.Remove(node);
    }
}

And the TreeView helper has this signature:

public static string TreeView<T>(this HtmlHelper htmlHelper, string treeId,
   IEnumerable<T> rootItems, Func<T, IEnumerable<T>> childrenProperty, 
   Func<T, string> itemContent, bool includeJavascript, string emptyContent)
{
    ...
}

So as a result i need my Tree struture to implement IEnumerable so i can use it with the TreeView helper, and this leads to the question: where and how would i implement IEnumerable in this situation?

Answer 1

This article by Wes Dyer is good reading for anyone who wants to implement a recursive tree iterator:

http://blogs.msdn.com/wesdyer/archive/2007/03/23/all-about-iterators.aspx

Answer 2

I don't fully understand the exact details of your tree structure, but here is a simple implementation that takes a generic tree of nodes and recursively renders it into html lists.

public static string TreeView<T>(IEnumerable<T> rootItems,
                                 Func<T, IEnumerable<T>> childrenProperty,
                                 Func<T, string> itemContent)
{
    if (rootItems == null || !rootItems.Any()) return null;

    var builder = new StringBuilder();
    builder.AppendLine("<ul>");

    foreach (var item in rootItems)
    {
        builder.Append("  <li>").Append(itemContent(item)).AppendLine("</li>");
        var childContent = htmlHelper.TreeView(treeId,
                                               childrenProperty(item),
                                               childrenProperty,
                                               itemContent);

        if (childContent != null)
        {
            var indented = childContent.Replace(Environment.NewLine,
                                                Environment.NewLine + "  ");
            builder.Append("  ").AppendLine(indented);
        }
    }

    builder.Append("</ul>");
    return builder.ToString();
}

The node class that I'm using is relatively simple with only two properties.

public class Node<T>
{
    public Node(T data)
    {
        Data = data;
        Children = new List<Node<T>>();
    }

    public T Data { get; private set; }
    public ICollection<Node<T>> Children { get; private set; }
}

Here is some test code that outputs the tree to the console.

var Records = new[] {
    new Node<string>("one") {
        Children = {
            new Node<string>("one-one") {
                Children = {
                    new Node<string>("one-one-one"),
                    new Node<string>("one-one-two"),
                    new Node<string>("one-one-three")
                }
            },
            new Node<string>("one-two"),
            new Node<string>("one-three")
        }
    },
    new Node<string>("two"),
    new Node<string>("three")
};
Console.WriteLine(TreeView(Records,
                           r => r.Children,
                           r => r.Data));

And here are the results from the above code.

<ul>
  <li>one</li>
  <ul>
    <li>one-one</li>
    <ul>
      <li>one-one-one</li>
      <li>one-one-two</li>
      <li>one-one-three</li>
    </ul>
    <li>one-two</li>
    <li>one-three</li>
  </ul>
  <li>two</li>
  <li>three</li>
</ul>