TreeView Part 1 - Populating the New TreeView Control from a Hierarchical Database Table - Step 3 - Building the Tree
(Page 4 of 4 )
To explain first of all, we need to build the tree node by node. We specify to start with the Tree’s root node set, and start with a parent id of ‘0’. This would be the president of the company, the home directory of a site, the root of a product list, etc. Then the DataSet is searched for any items with that parent id (in this case, the ‘mgr_id’). Any found are placed into the tree as a node. Then the function calls itself with that employee’s id as the parent id. Any children (reporting employees, sub-directories) are populated, and the recursion takes place for each. Each time we get to a node with no children (a leaf node) the function exits, and continues populating children nodes for the previous parent, all the way back to the root. Now here’s all that in code:
private void BuildEmployeeList(TreeNodeCollection nodes,
Int32 IntParent)
{
Int32 ThisID;
String ThisName;
DataRow[] children =
EmployeeDS.Tables["employees"].Select
("mgr_id='"+IntParent+"'");
//no child nodes, exit function
if (children.Length == 0) return;
foreach (DataRow child in children)
{
// step 1
ThisID = Convert.ToInt32(child.ItemArray[0]);
// step 2
ThisName = Convert.ToString(child.ItemArray[1]);
// step 3
TreeNode NewNode =
new TreeNode(ThisName, ThisID.ToString());
// step 4
nodes.Add(NewNode);
NewNode.ToggleExpandState();
// step 5
BuildEmployeeList(NewNode.ChildNodes, ThisID);
}
}
Rather than break up the code with explanation, here’s each step explained so that you can understand what’s happening where, in case you need to modify or debug the code for you own purposes.
Step #
- Here we retrieve the id of the current employee for use in creating the node and feeding back in the recursive call to find any subordinates.
- The name is retrieved, more for display purposes than anything functional.
- Here a new TreeNode is created on the fly, with the name as the display text, and the id as the string value. This is necessary for the SelectEmployee method we created earlier. Within that method, you would parse that unique id value, and use it to retrieve the information on that specific employee from the database.
- The node is added to the Tree. Then we toggle the expanded state, which both sets it to collapsed, and actually gives it an expanded property value. This will save you many headaches later.
- Now we recursively call the same method, now using the current employee’s id as the parent id, and the current node as the parent node. If no children are found, the method will simply move on to the next ‘sibling’ node.
Conclusion
There you have it, a fully functioning TreeView. Well, functioning in that it will actually display the employee data in a hierarchical manner when you load the page.
There is still much functionality we could add. In my next article, I’ll explain how to select a specific employee from the list, perhaps by a variable passed in the query string, and retrieve data for that employee. Until then, have fun!
| DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware. |
/ 26 
