Post
Ask Question

Bind ASP.NET Menu Control Using C#

This blog will show you how you can bind ASP.NET menu control, using C# .NET from the data set. Thus, for this blog, first we will create a new ASP.NET Application and add the code given below into the page.
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Menu.aspx.cs" Inherits="WebApplication7.Menu" %>  
  2.   
  3. <!DOCTYPE html>  
  4.   
  5. <html xmlns="http://www.w3.org/1999/xhtml">  
  6. <head runat="server">  
  7.     <title>Bind Asp.net Menu Control Using C#</title>  
  8. </head>  
  9. <body>  
  10.     <form id="form1" runat="server">  
  11.         <div>  
  12.             <b>ASP.NET Menu Control</b>  
  13.             <asp:Menu ID="Menu1" runat="server" BackColor="#F7F6F3"  
  14.                 DynamicHorizontalOffset="2" Width="50%"  
  15.                 Font-Names="Verdana" Font-Size="0.9em" ForeColor="#7C6F57"  
  16.                 StaticSubMenuIndent="10px" StaticEnableDefaultPopOutImage="false" Orientation="Horizontal">  
  17.                 <StaticSelectedStyle BackColor="#5D7B9D" />  
  18.                 <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />  
  19.                 <DynamicHoverStyle BackColor="#7C6F57" ForeColor="White" />  
  20.                 <DynamicMenuStyle BackColor="#F7F6F3" />  
  21.                 <DynamicSelectedStyle BackColor="#5D7B9D" />  
  22.                 <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />  
  23.                 <StaticHoverStyle BackColor="#7C6F57" ForeColor="White" />  
  24.             </asp:Menu>  
  25.         </div>  
  26.     </form>  
  27. </body>  
  28. </html> 
Afterwards, write the code to bind the menu item from the backend code. For this, we will create a data set to bind it to the menu control or we will create a new data set function.
  1. public DataSet GetData()  
  2.        {  
  3.            // In order to test, we use the memory tables as the datasource.  
  4.            DataTable mainTB = new DataTable();  
  5.            DataColumn mainIdCol = new DataColumn("mainId");  
  6.            DataColumn mainNameCol = new DataColumn("mainName");  
  7.            DataColumn mainUrlCol = new DataColumn("mainUrl");  
  8.            mainTB.Columns.Add(mainIdCol);  
  9.            mainTB.Columns.Add(mainNameCol);  
  10.            mainTB.Columns.Add(mainUrlCol);  
  11.   
  12.            DataTable childTB = new DataTable();  
  13.            DataColumn childIdCol = new DataColumn("childId");  
  14.            DataColumn childNameCol = new DataColumn("childName");  
  15.   
  16.            // The MainId column of the child table is the foreign key to the main table.  
  17.            DataColumn childMainIdCol = new DataColumn("MainId");  
  18.            DataColumn childUrlCol = new DataColumn("childUrl");  
  19.   
  20.            childTB.Columns.Add(childIdCol);  
  21.            childTB.Columns.Add(childNameCol);  
  22.            childTB.Columns.Add(childMainIdCol);  
  23.            childTB.Columns.Add(childUrlCol);  
  24.   
  25.   
  26.            // Insert some test records to the main table.  
  27.            DataRow dr = mainTB.NewRow();  
  28.            dr[0] = "1";  
  29.            dr[1] = "Home";  
  30.            dr[2] = "Test.aspx";  
  31.            mainTB.Rows.Add(dr);  
  32.            DataRow dr1 = mainTB.NewRow();  
  33.            dr1[0] = "2";  
  34.            dr1[1] = "Articles";  
  35.            dr1[2] = "Test.aspx";  
  36.            mainTB.Rows.Add(dr1);  
  37.            DataRow dr2 = mainTB.NewRow();  
  38.            dr2[0] = "3";  
  39.            dr2[1] = "Help";  
  40.            dr2[2] = "Test.aspx";  
  41.            mainTB.Rows.Add(dr2);  
  42.            DataRow dr3 = mainTB.NewRow();  
  43.            dr3[0] = "4";  
  44.            dr3[1] = "DownLoad";  
  45.            dr3[2] = "Test.aspx";  
  46.            mainTB.Rows.Add(dr3);  
  47.   
  48.   
  49.            // Insert some test records to the child table  
  50.            DataRow dr5 = childTB.NewRow();  
  51.            dr5[0] = "1";  
  52.            dr5[1] = "ASP.NET";  
  53.            dr5[2] = "2";  
  54.            dr5[3] = "Test.aspx";  
  55.            childTB.Rows.Add(dr5);  
  56.            DataRow dr6 = childTB.NewRow();  
  57.            dr6[0] = "2";  
  58.            dr6[1] = "SQL Server";  
  59.            dr6[2] = "2";  
  60.            dr6[3] = "Test.aspx";  
  61.            childTB.Rows.Add(dr6);  
  62.            DataRow dr7 = childTB.NewRow();  
  63.            dr7[0] = "3";  
  64.            dr7[1] = "JavaScript";  
  65.            dr7[2] = "2";  
  66.            dr7[3] = "Test.aspx";  
  67.            childTB.Rows.Add(dr7);  
  68.   
  69.            // Use the DataSet to contain that two tables.  
  70.            DataSet ds = new DataSet();  
  71.            ds.Tables.Add(mainTB);  
  72.            ds.Tables.Add(childTB);  
  73.   
  74.            // Build the relation between the main table and the child table.  
  75.            ds.Relations.Add("Child", ds.Tables[0].Columns["mainId"], ds.Tables[1].Columns["MainId"]);  
  76.   
  77.   
  78.            return ds;  
  79.        }   
In the function, given above, we have to create a date set for the menu. Now, check the function, given below, to bind it with the menu. 
  1. public void GenerateMenuItem()  
  2.       {  
  3.           // Get the data from database.  
  4.           DataSet ds = GetData();  
  5.   
  6.           foreach (DataRow mainRow in ds.Tables[0].Rows)  
  7.           {  
  8.               // Load the records from the main table to the menu control.  
  9.               MenuItem masterItem = new MenuItem(mainRow["mainName"].ToString());  
  10.               masterItem.NavigateUrl = mainRow["mainUrl"].ToString();  
  11.               Menu1.Items.Add(masterItem);  
  12.   
  13.               foreach (DataRow childRow in mainRow.GetChildRows("Child"))  
  14.               {  
  15.                   // According to the relation of the main table and the child table, load the data from the child table.  
  16.                   MenuItem childItem = new MenuItem((string)childRow["childName"]);  
  17.                   childItem.NavigateUrl = childRow["childUrl"].ToString();  
  18.                   masterItem.ChildItems.Add(childItem);  
  19.               }  
  20.           }  
  21.       }   
Now, call the function, given above, on the page load. 
  1. protected void Page_Load(object sender, EventArgs e)  
  2.        {  
  3.            if (!IsPostBack)  
  4.            {  
  5.                GenerateMenuItem();  
  6.            }  
  7.        }   
Now, we are done. Just run the Application to check the output.

output