Fun half hour: Using ASP.NET tree list in unbound mode

This started out as a customer email/phone question and instead of just passing it off to support, I thought I'd take a quick half hour off and solve it for myself. Without even asking Mehul, no less. Oh all right, I admit it, I wanted to do some programming for a change.

The scenario: Web site. ASPxTreeList. Unbound mode. At least one column per node to show some data.

Our unbound demo for the tree list was a good start, but it didn't show that required extra column. No matter, I just used it as a basis for my quick solution.

First off I dropped an ASPxTreeList onto a new website and renamed it to treeList. I then opened up the smart tag and selected Columns.

Here I added two columns, the first's Caption property set to Nodes, the second, Size. (The image above shows the result of this change.)

I set the FieldName property for the first column to Name and the second to Size.

Now time for some code. I warn you, it's simple stuff indeed. I didn't set up any special classes to hold my data, I just used the node class from the tree list (TreeListNode). My example shows a simple hierarchy from our community site. So there's Forums and Blogs, and within Forums, there are some major categories like "general" and "dotnet_products". The node leaves will have a completely made up size value.

public partial class _Default : System.Web.UI.Page {

  private TreeListNode CreateNode(object key, string name, int size, TreeListNode parentNode) {
    TreeListNode node = treeList.AppendNode(key, parentNode);
    node["Name"] = name;
    node["Size"] = size;
    return node;
  }

  private void CreateNodes() {
    TreeListNode forums = CreateNode(1000, "Forums", 0, null);
    forums.Expanded = true;

    TreeListNode general = CreateNode(1100, "general", 0, forums);

    CreateNode(1101, "discussion", 1234, general);
    CreateNode(1102, "ordering", 567, general);
    CreateNode(1103, "test", 89, general);

    TreeListNode dotNetProducts = CreateNode(1200, "dotnet_products", 0, forums);

    CreateNode(1201, "aspxtreelist", 147, dotNetProducts);
    CreateNode(1202, "aspxgridview", 258, dotNetProducts);

    TreeListNode blogs = CreateNode(200, "Blogs", 0, null);

    CreateNode(201, "ctodx", 345, blogs);
    CreateNode(202, "mehulharry", 123, blogs);
  }

  protected void Page_Load(object sender, EventArgs e) {
    CreateNodes();
  }
}

So, on a page load, I create the nodes structure afresh (of course, I could save it off somewhere if I wanted to and reuse the saved version). The CreateNodes method is somewhat trivial and sets up the hierarchy with lots of calls to CreateNode. This does the actual work of creating a node, adding it to the tree list instance, and then setting the fields Name and Size. As you can deduce from just this code, the node implements a dictionary keyed off the field name to store its "data". Here are the lines that set the "fields" of the node data.

    node["Name"] = name;
    node["Size"] = size;

Notice that they are the same identifiers that I used for the FieldName property in the columns of the tree list.

Simple. After that, it's just a case of compiling and running with this result, after expanding all the nodes:

Oh well, enough fun, back to my real work.

Free DevExpress Products – Get Your Copy Today