Bootstrap 3 - Desaparece el submenu al realizar click en cualquier enlace

Buenas,

Tengo el siguiente menú desplegable. Este es el código HTML:

<ul class="nav navbar-nav">
    <li class="dropdown">
        <a href="#" data-toggle="dropdown" class="dropdown-toggle"><img src="img/ico_menu_off.png" /></a>
        <div id="MainMenu" class="dropdown-menu">
          <div class="list-group panel">
            <a href="#demo3" class="dropdown-toggle list-group-item list-group-item-success" data-toggle="collapse" data-parent="#MainMenu">Links to Portals</a>
            <div class="collapse" id="demo3">
              <a href="#SubMenu1" class="list-group-item" data-toggle="collapse" data-parent="#SubMenu1">Portal 1 <i class="fa fa-caret-down"></i></a>
              <a href="#SubMenu1" class="list-group-item" data-toggle="collapse" data-parent="#SubMenu1">Portal 2 <i class="fa fa-caret-down"></i></a>
              <a href="#SubMenu1" class="list-group-item" data-toggle="collapse" data-parent="#SubMenu1">Portal 3 <i class="fa fa-caret-down"></i></a>
              <a href="#SubMenu1" class="list-group-item" data-toggle="collapse" data-parent="#SubMenu1">Portal 4 <i class="fa fa-caret-down"></i></a>
            </div>
            <a href="#demo4" class="list-group-item list-group-item-success" data-toggle="collapse" data-parent="#MainMenu">Links to Calculators</a>
            <div class="collapse" id="demo4">
              <a href="" class="list-group-item">Portal 1</a>
              <a href="" class="list-group-item">Portal 2</a>
              <a href="" class="list-group-item">Portal 3</a>
            </div>
             <a href="#demo5" class="list-group-item list-group-item-success" data-toggle="collapse" data-parent="#MainMenu">Links to Tools</a>
            <div class="collapse" id="demo5">
              <a href="" class="list-group-item">Portal 1</a>
              <a href="" class="list-group-item">Portal 2</a>
              <a href="" class="list-group-item">Portal 3</a>
            </div>
          </div>
        </div>
    </li>   
</ul>

Este es el código css:

#customer-information .list-group.panel > .list-group-item {
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px
}
#customer-information .list-group-submenu {
  margin-left:20px;
}

Pero no funciona como quisiera, necesito que al hacer click en cada uno de las opciones, el menú no desaparezca, solamente debería cerrarse cuando se realice click en el icono que despliega el menú.

Muchas gracias,