0

I can't hide submenus in the vertical nav bar after clicking the submenu that links to the web form in the folder. But it's fine for webforms outside the folder.

isherwood
  • 58,414
  • 16
  • 114
  • 157
Ngu Wah Kyaw
  • 25
  • 1
  • 5

2 Answers2

0

.list-group.panel>.list-group-item {
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px
}
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="container-fluid">

  <div class="row">
    <div class="col-md-2">

      <!-- menu -->
      <div id="MainMenu">
        <div class="list-group panel">
          <a href="#" class="list-group-item list-group-item-success" data-parent="#MainMenu">Item 1</a>
          <a href="#" class="list-group-item list-group-item-success" data-parent="#MainMenu">Item 2</a>
          <a href="#demo3" class="list-group-item list-group-item-success" data-toggle="collapse" data-parent="#MainMenu">Item 3 <i class="fa fa-caret-down"></i></a>
          <div class="collapse" id="demo3">
            <a href="#SubMenu1" class="list-group-item" data-toggle="collapse" data-parent="#SubMenu1">Subitem 1 <i class="fa fa-caret-down"></i></a>
            <div class="collapse list-group-submenu" id="SubMenu1">
              <a href="#" class="list-group-item" data-parent="#SubMenu1">Subitem 1 a</a>
              <a href="#" class="list-group-item" data-parent="#SubMenu1">Subitem 2 b</a>
              <a href="#SubSubMenu1" class="list-group-item" data-toggle="collapse" data-parent="#SubSubMenu1">Subitem 3 c <i class="fa fa-caret-down"></i></a>
              <div class="collapse list-group-submenu list-group-submenu-1" id="SubSubMenu1">
                <a href="#" class="list-group-item" data-parent="#SubSubMenu1">Sub sub item 1</a>
                <a href="#" class="list-group-item" data-parent="#SubSubMenu1">Sub sub item 2</a>
              </div>
              <a href="#" class="list-group-item" data-parent="#SubMenu1">Subitem 4 d</a>
            </div>
            <a href="javascript:;" class="list-group-item">Subitem 2</a>
            <a href="javascript:;" class="list-group-item">Subitem 3</a>
          </div>
          <a href="#demo4" class="list-group-item list-group-item-success" data-toggle="collapse" data-parent="#MainMenu">Item 4  <i class="fa fa-caret-down"></i></a>
          <div class="collapse" id="demo4">
            <a href="" class="list-group-item">Subitem 1</a>
            <a href="" class="list-group-item">Subitem 2</a>
            <a href="" class="list-group-item">Subitem 3</a>
          </div>
        </div>
      </div>
    </div>
  </div>

</div>
isherwood
  • 58,414
  • 16
  • 114
  • 157
Saif Warsi
  • 338
  • 1
  • 3
  • 15
  • Please don't tag the question asker in your answers, and you might offer some explanation of what you did to make this work in your answer. – isherwood Jan 08 '20 at 14:48
0

I got the answer. I have master page and content pages. It is file path issue. Menu works properly for the files in the same folder with the master page but not for the files in the different folder. I found this link and got the answer for my problems.

ASP.Net Master Page and File path issues

Ngu Wah Kyaw
  • 25
  • 1
  • 5