Create Dynamic Side Menu using ASP.net


Here is our .aspx code to populate our side  menu (you can apply your css as you wish):
  <div id="divSideMenu" runat="server"></div>


Here is our .aspx.cs code:
SqlConnection dbconn = new SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings["ConnectionString"].ToString());

    protected void bindMenuTOP()
    {
        string MenuTop = "";
        string MenuChild = "";
        StringBuilder strb = new StringBuilder();
        string TopMenu = "SELECT id, MenuName, MenuURL FROM ParentMenuMaster";
        DataTable dtTopMenu = GetDataTable(TopMenu);
        if (dtTopMenu.Rows.Count > 0)
        {
            strb.Append("
    "
);
            for (int pm = 0; pm < dtTopMenu.Rows.Count; pm++)
            {
                MenuTop = dtTopMenu.Rows[pm]["MenuName"].ToString();
                string MenuTopURL = dtTopMenu.Rows[pm]["MenuURL"].ToString();
                strb.Append("
  • "
  • );
                    strb.Append("" + MenuTop + "
    ");
                    strb.Append("
      "
    );
                    string ChildMenu = "SELECT MenuName, MenuURL FROM ChildMenuMaster WHERE ParentMenuID = " + dtTopMenu.Rows[i]["id"] + "";
                    DataTable dtChildMenu = GetDataTable(ChildMenu);
                    if (dtChildMenu.Rows.Count > 0)
                    {
                        strb.Append("
  • "
  • );
                        strb.Append("
      "
    );
                        for (int cm = 0; cm < dtChildMenu.Rows.Count; cm++)
                        {
                            MenuChild = dtChildMenu.Rows[cm]["MenuName"].ToString();
                            string MenuChildURL = dtChildMenu.Rows[cm]["MenuURL"].ToString();
                            strb.Append("
  • "
  • );
                            strb.Append("" + MenuChild + "
    ");
                            strb.Append("
    ");
                        }
                        strb.Append("
    ");
                        strb.Append("
    ");
                    }
                    strb.Append("
    ");
                    divSideMenu.InnerHtml = strb.ToString();
                }
            }
        }

        public DataTable GetDataTable(string CommandText)
        {
            DataTable dt = new DataTable();
            SqlCommand cmd = new SqlCommand();
            cmd.CommandTimeout = 0;
            cmd.Connection = dbconn;
            try
            {
                dbconn.Open();
                cmd.CommandText = CommandText;
                cmd.CommandType = CommandType.Text;
                SqlDataAdapter adap = new SqlDataAdapter();
                adap.SelectCommand = cmd;
                adap.Fill(dt);
            }
            finally
            {
                dbconn.Close();
            }
            return dt;
        }

    I hope it will help you to create a simple and comfort Side Menu bar with the help of UL and LI. Here is just script of table to run on your database:
    CREATE Table ParentMenuMaster(id int identity(1,1), MenuName varchar(100), MenuURL varchar(100))

    CREATE Table ChildMenuMaster(id int identity(1,1), MenuName varchar(100), MenuURL varchar(100), ParentMenuID int)

    INSERT INTO ParentMenuMaster VALUES('ParentMenu1','parentMenu1.aspx')
    INSERT INTO ParentMenuMaster VALUES('ParentMenu2','parentMenu2.aspx')
    GO
    INSERT INTO ChildMenuMaster VALUES('Child Menu1','childMenu1.aspx',1)
    INSERT INTO ChildMenuMaster VALUES('Child Menu2','childMenu2.aspx',1)
    INSERT INTO ChildMenuMaster VALUES('Child Menu3','childMenu3.aspx',1)
    GO
    INSERT INTO ChildMenuMaster VALUES('Child Menu4','childMenu4.aspx',2)
    INSERT INTO ChildMenuMaster VALUES('Child Menu5','childMenu5.aspx',2)
    INSERT INTO ChildMenuMaster VALUES('Child Menu6','childMenu6.aspx',2)
    GO
    SELECT * FROM ParentMenuMaster
    SELECT * FROM ChildMenuMaster

    I hope you will not be facing any issue while creating Parent and Child menu with their relations as I have created above.
    Cheers.

    Comments