Как сделать отзывчивое динамическое меню в asp.net mvc

Question

Как сделать адаптивное динамическое меню в asp.net mvc.У меня есть 3 уровня в этом меню. 1 уровень - это меню, 2 уровень - это подменю, а последний уровень - это подменю. Эти данные получены из базы данных. Я ужепопытался адаптировать меню, но оно не в порядке. Я хочу эту строку меню в стиле data-toggle="collapse".

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" />
<div class="navigation">
  <div class="navbar navbar-fixed-top" id="mainnav">
    <div class="menu">
      @Html.Action("MenuLayout", "Menu")
    </div>
  </div>
</div>
<div class="container-fluid" style="background:#68c2fe;">
  <div class="row">
    <div class="col-lg-11">
      <nav id='cssmenu'>
        <ul id="ul_1">
          @{ foreach (var dr in Model) {
          <li>
            <a href='#'>@dr.MainMenuName</a> @{ ((POS_System.Controllers.MenuController)this.ViewContext.Controller).get_Submenu(dr.ID.ToString()); }
            <ul>
              @{ foreach (POS_System.Models.SubMenu subitem in Session["submenu"] as List
              <POS_System.Models.SubMenu>) {

                <li>
                  <a href='#'>@subitem.SubMenuName</a> @{ ((POS_System.Controllers.MenuController)this.ViewContext.Controller).get_Subtosubmenu((subitem.ID).ToString(), Session["RoleId"] == null ? string.Empty : Session["RoleId"].ToString()); }
                  <ul>
                    @{ foreach (POS_System.Models.SubToSubMenu subtosubitem in Session["subtosubmenu"] as List
                    <POS_System.Models.SubToSubMenu>) {
                      <li>
                        @Html.ActionLink(@subtosubitem.Description, "Index", @subtosubitem.SubToSubMenuName)
                      </li>

                      } }

                  </ul>

                </li>

                } }
            </ul>

          </li>

          } }

        </ul>

      </nav>
    </div>
    <div class="col-lg-1"></div>
  </div>
</div>