Bootstrap Responsive ASP.Net Menu control for Mobile Phone, Tablet and Desktop display with multiple Parent and child

Hi ANDRADE,

I have created a sample which full fill your requirement

Main.Master

<div>
    <style type="text/css">
        .dropdown-submenu
        {
            position: relative;
        }
        .dropdown-submenu > .dropdown-menu
        {
            top: 0;
            left: 100%;
            margin-top: -6px;
            margin-left: -1px;
            -webkit-border-radius: 0 6px 6px 6px;
            -moz-border-radius: 0 6px 6px 6px;
            border-radius: 0 6px 6px 6px;
        }
        .dropdown-submenu > a:after
        {
            display: block;
            content: " ";
            float: right;
            width: 0;
            height: 0;
            border-color: transparent;
            border-style: solid;
            border-width: 5px 0 5px 5px;
            border-left-color: #cccccc;
            margin-top: 5px;
            margin-right: -10px;
        }
        .dropdown-submenu:hover > a:after
        {
            border-left-color: #555;
        }
        .dropdown-submenu.pull-left
        {
            float: none;
        }
        .dropdown-submenu.pull-left > .dropdown-menu
        {
            left: -100%;
            margin-left: 10px;
            -webkit-border-radius: 6px 0 6px 6px;
            -moz-border-radius: 6px 0 6px 6px;
            border-radius: 6px 0 6px 6px;
        }
    </style>
    <link rel="stylesheet" href='http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css'
        media="screen" />
    <script type="text/javascript" src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js'></script>
    <script type="text/javascript" src='http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js'></script>
    <div class="navbar navbar-default">
        <div class="container-fluid">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
                    aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span><span
                        class="icon-bar"></span><span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">ASPSnippets</a>
            </div>
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <asp:Menu ID="Menu1" runat="server" Orientation="Horizontal" RenderingMode="List"
                    IncludeStyleBlock="false" StaticMenuStyle-CssClass="nav navbar-nav" DynamicMenuStyle-CssClass="dropdown-menu">
                </asp:Menu>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        //Disable the default MouseOver functionality of ASP.Net Menu control.
        Sys.WebForms.Menu._elementObjectMapper.getMappedObject = function () {
            return false;
        };
        $(function () {
            $(".navbar-nav li, .navbar-nav a, .navbar-nav ul").removeAttr('style');
            $(".dropdown-menu").closest("li").removeClass().addClass("dropdown-toggle");
            $(".dropdown-toggle").find("a[href='javascript:;']").attr("data-toggle", "dropdown");
            $(".dropdown-toggle").find("a[href='javascript:;'].level1").append("<span class='caret'></span>");
            $(".dropdown-toggle").find("a[href='javascript:;']:not(.level1)").closest('li').addClass('dropdown-submenu');
            $("a.selected").closest("li").addClass("active");
            $("a.selected").closest(".dropdown-toggle").addClass("active");
            $('ul.dropdown-menu [data-toggle=dropdown]').on('click', function (event) {
                event.preventDefault();
                event.stopPropagation();
                $(this).parent().siblings().removeClass('open');
                $(this).parent().toggleClass('open');
            });
        });
    </script>
    <hr />
    <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
    </asp:ContentPlaceHolder>
</div>

Main.master.cs

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        DataTable dt = this.GetData();
        PopulateMenu(dt);
    }
}

private DataTable GetData()
{
    string query = "SELECT [MenuId], [ParentMenuId], [Title], [Description], [Url] FROM [TestMenus]";
    string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
    using (SqlConnection con = new SqlConnection(constr))
    {
        DataTable dt = new DataTable();
        using (SqlCommand cmd = new SqlCommand(query))
        {
            using (SqlDataAdapter sda = new SqlDataAdapter())
            {
                cmd.CommandType = CommandType.Text;
                cmd.Connection = con;
                sda.SelectCommand = cmd;
                sda.Fill(dt);
            }
        }
        return dt;
    }
}

private void PopulateMenu(DataTable dt)
{
    string currentPage = Path.GetFileName(Request.Url.AbsolutePath);
    DataView view = new DataView(dt);
    view.RowFilter = "ParentMenuId=0";
    foreach (DataRowView row in view)
    {
        MenuItem menuItem = new MenuItem
        {
            Value = row["MenuId"].ToString(),
            Text = row["Title"].ToString(),
            NavigateUrl = row["Url"].ToString(),
            Selected = row["Url"].ToString().EndsWith(currentPage, StringComparison.CurrentCultureIgnoreCase)
        };
        Menu1.Items.Add(menuItem);
        AddChildItems(dt, menuItem);
    }
}

private void AddChildItems(DataTable table, MenuItem menuItem)
{
    DataView viewItem = new DataView(table);
    viewItem.RowFilter = "ParentMenuId=" + menuItem.Value;
    foreach (DataRowView childView in viewItem)
    {
        MenuItem childmenuItem = new MenuItem
        {
            Value = childView["MenuId"].ToString(),
            Text = childView["Title"].ToString(),
            NavigateUrl = childView["Url"].ToString(),
        };
        menuItem.ChildItems.Add(childmenuItem);
        AddChildItems(table, childmenuItem);
    }
}

TableData

ScreenShot