Bootstrap 3 multi level dropdown menu not working in mobile

Question

Bootstrap 3 multi level dropdown menu not working on mobile devices. I checked many solution in StackOverflow. That solution for Desktop not for mobile. Below is the best solutions for multi lebel dropdown menu.

Bootstrap 3 dropdown sub menu missing

https://github.com/djokodonev/bootstrap-multilevel-dropdown

$('ul.dropdown-menu [data-toggle=dropdown]').on('click', function(event) {
  // Avoid following the href location when clicking
  event.preventDefault();
  // Avoid having the menu to close when clicking
  event.stopPropagation();
  // If a menu is already open we close it
  $('ul.dropdown-menu [data-toggle=dropdown]').parent().removeClass('open');
  // opening the one you clicked on
  $(this).parent().addClass('open');
});

Above code is working well for desktop.

Live example: http://rahulmoral.com/portfolio/essanet/

Please view on mobile devices. Second level dropdown-menu will not work on mobile devices.

Answer 1

It's actually working just fine. You need to scroll in order to see the expanded menu. However, to get it to work as you'd like, simply overwrite the max-height :

.navbar-collapse {
    max-height: none;
}

Answer 2

i got it to working by adding this to my css

@media screen and (max-width: 767px){
.navbar-fixed-top .navbar-collapse{
    max-height:100%;
} }

but instead of 100% you can also use none. i am using a fixed nav which is why i have navbar fixed top. u can change it to static or we you are using.