Bind Treeview from a DataBase in ASP.Net

Introduction:

In this article we will see how to bind an ASP.Net TreeView control from a database using the parent child relation.

Background:

For this task in my beginner level of programming I spent one day. My requirement was to bind a TreeView control from database values from two different tables releated with each other. Finally I got my solution at the end of the day.

In this task it was like binding a main root node of the TreeView from a parent table and on the basis of the value refering to the child table get the corresponding values and bind them under the main root nodes. How to do that we will see step by step.

Step 1:

Create a web application with one TreeView control on Default.aspx.

Step 2:

Now in the Default.aspx.cs page first get the values from the Parent table in Datatable or Dataset object as below.
//this values can be from Database. For understanding I'm binding it only.

public DataTable RootNodes()
    {
        DataTable dt = new DataTable("Root");
        dt.Columns.Add("RootId", typeof(int));
        dt.Columns.Add("RootDesc", typeof(String));
        DataRow dr = dt.NewRow();
        dr[0] = "10";
        dr[1] = "Root Node One";
        dt.Rows.Add(dr);
        DataRow dr1 = dt.NewRow();
        dr1[0] = "20";
        dr1[1] = "Root Node Two";
        dt.Rows.Add(dr1);
        return dt;
    }

Step 3:

Bind the RootNode values to the TreeView first.

DataTable dt = RootNodes();
            TreeNode headnode = new TreeNode();
            headnode.Text = "This Is Head Node";
            TreeView1.Nodes.Add(headnode);
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                TreeNode firstchild = new TreeNode();
                firstchild.Text = dt.Rows[i][1].ToString();
                headnode.ChildNodes.Add(firstchild);

            }

Step 4:

Now get the values for Child Nodes on the basis of the Parent node values.

//you can pass argument for this method and select the values from database.
public DataTable ChildNodes()
    {
        DataTable dt = new DataTable("Child");
        dt.Columns.Add("ChildId", typeof(int));
        dt.Columns.Add("ChildDesc", typeof(string));
        DataRow dr = dt.NewRow();
        dr[0] = "10";
        dr[1] = "Child Node One";
        dt.Rows.Add(dr);
        DataRow dr1 = dt.NewRow();
        dr1[0] = "20";
        dr1[1] = "Child Node Two";
        dt.Rows.Add(dr1);
        return dt;
    }

Step 5:

Now bind ChildNodes to Treeview by getting values.

if (!IsPostBack)
        {
           
            //Can call From Database also
            DataTable dt = RootNodes();
            TreeNode headnode = new TreeNode();
            headnode.Text = "This Is Head Node";
            TreeView1.Nodes.Add(headnode);
            //Loop for binding Parent Values
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                TreeNode firstchild = new TreeNode();
                firstchild.Text = dt.Rows[i][1].ToString();
                headnode.ChildNodes.Add(firstchild);
                //Can call from Database on the basis of value of firstchild
                //Here you can pass argument.
                DataTable dt1 = ChildNodes();
                //Loop for binding Child Values.
                for (int j = 0; j < dt1.Rows.Count; j++)
                {
                    TreeNode childnode = new TreeNode();
                    childnode.Text = dt1.Rows[j][1].ToString();
                    firstchild.ChildNodes.Add(childnode);
                    //more over can expand the list.
                }
            }
        }

Conclusion:

In the simple manner we can bind values to a TreeView control from multiple tables.