The following is my menu item data table in design mode:

sql database

The following is the script of my table:

  1. CREATE TABLE [dbo].[tbl_Menu](
  2. [Menu_ID] [int] IDENTITY(1,1) NOT NULL,
  3. [Menu_ParentID] [int] NULL,
  4. [Menu_Name] [varchar](50) NULL,
  5. [Menu_Page_URL] [varchar](500) NULL,
  6. CONSTRAINT [PK_tbl_Menu] PRIMARY KEY CLUSTERED
  7. (
  8. [Menu_ID] ASC
  9. )WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
  10. ) ON [PRIMARY]
  12. GO

Now the data in my tbl_Menu table:

tbl_menu table

Here in this application I am using a Master Pager to provide a consistent look in the entire application. So I wrote code to generate a menu item from the database in MasterPage.master.cs.

The following is my MasterPage.Master:

  1. <%@ Master Language="C#" AutoEventWireup="true" CodeBehind="MasterPage.master.cs" Inherits="MenuFromDB.MasterPage" %>
  3. <!DOCTYPE html>
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head runat="server">
  7. <title></title>
  8. <link href="StyleSheetMenu.css" rel="stylesheet" />
  9. <link href="StyleSheet.css" rel="stylesheet" />
  10. <asp:ContentPlaceHolder ID="head" runat="server">
  11. </asp:ContentPlaceHolder>
  12. </head>
  13. <body>
  14. <form id="form1" runat="server">
  15. <div>
  16. <table cellpadding="1" cellspacing="1" width="880px" align="center" class="BlueBorder"
  17. style="background: White;">
  18. <tr>
  19. <td style="height: 100px; background-color: skyblue; padding-left: 10px;">
  20. <span style="font-size: 20pt; font-weight: bold; color: blue;">Data Base Driven Menu Item In ASP.NET C#</span>
  21. </td>
  22. </tr>
  23. <tr>
  24. <td style="background-color: orange; padding-left: 1px;">
  25. <asp:Menu ID="MenuFromDB" runat="server" Orientation="Horizontal">
  26. <levelmenuitemstyles>
  27. <asp:menuitemstyle cssclass="Parent_Menu" />
  28. <asp:menuitemstyle cssclass="level_menu" />
  29. </levelmenuitemstyles>
  30. <staticselectedstyle cssclass="selected" />
  31. </asp:Menu>
  32. </td>
  33. </tr>
  34. <tr>
  35. <td style="padding-top: 40px; padding-bottom: 80px; padding-left: 10px">
  36. <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
  37. </asp:ContentPlaceHolder>
  38. </td>
  39. </tr>
  40. </table>
  42. </div>
  43. </form>
  44. </body>
  45. </html>
Now the MasterPage.Master.cs is:
  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Web;
  5. using System.Web.UI;
  6. using System.Web.UI.WebControls;
  7. using System.IO;
  8. using System.Data;
  9. using System.Data.SqlClient;
  10. using System.Configuration;
  12. namespace MenuFromDB
  13. {
  14. public partial class MasterPage : System.Web.UI.MasterPage
  15. {
  16. SqlDataAdapter da;
  17. DataSet ds = new DataSet();
  18. DataTable dt = new DataTable();
  20. protected void Page_Load(object sender, EventArgs e)
  21. {
  22. if (!Page.IsPostBack)
  23. {
  24. dt = GetMenuDataFromDB(0);
  25. PopulateMenu(dt, 0, null);
  26. }
  27. }
  29. public DataTable GetMenuDataFromDB(int MenuParentID)
  30. {
  31. SqlConnection con = new SqlConnection();
  32. ds = new DataSet();
  33. con.ConnectionString = @"Data Source=MyPC\SqlServer2k8; Initial Catalog=Test; Integrated Security=true;";
  34. SqlCommand cmd = new SqlCommand("SELECT * FROM tbl_Menu WHERE Menu_ParentID='" + MenuParentID + "'", con);
  36. da = new SqlDataAdapter(cmd);
  37. da.Fill(ds);
  38. con.Open();
  39. cmd.ExecuteNonQuery();
  40. con.Close();
  42. return ds.Tables[0];
  43. }
  45. private void PopulateMenu(DataTable dt, int Menu_Parent_ID, MenuItem Parent_MenuItem)
  46. {
  47. string currentPage = Path.GetFileName(Request.Url.AbsolutePath);
  48. foreach (DataRow row in dt.Rows)
  49. {
  50. MenuItem menuItem = new MenuItem
  51. {
  52. Value = row["Menu_Id"].ToString(),
  53. Text = row["Menu_Name"].ToString(),
  54. NavigateUrl = row["Menu_Page_URL"].ToString(),
  55. Selected = row["Menu_Page_URL"].ToString().EndsWith(currentPage, StringComparison.CurrentCultureIgnoreCase)
  56. };
  57. if (Menu_Parent_ID == 0)
  58. {
  59. MenuFromDB.Items.Add(menuItem);
  60. DataTable dtChildMenu = new DataTable();
  61. dtChildMenu = this.GetMenuDataFromDB(int.Parse(menuItem.Value));
  62. PopulateMenu(dtChildMenu, int.Parse(menuItem.Value), menuItem);
  63. }
  64. else
  65. {
  66. Parent_MenuItem.ChildItems.Add(menuItem);
  67. }
  68. }
  69. }
  70. }
  71. }

Now run the application.

demo application

report menuitem

Now hover on any menu and see the child menu.

aboutus menuitem

social tab menuitem