Dropdowns en bootstrap

[alfredorods]

holaa foreros, como puedo utilizar varios dropdows dentro de una misma pagina?

tengo el dropdown del menu principal (navbar) pero este menu principal tiene dos opciones que contienen dropdowns, en este caso cuando se prueba en version movil al darle click al dropdown del menu funciona perfecto pero al intentar clickear sobre las otras opciones dropdowns la principal del navbar se oculta..

Código:

<div id="mainmenu">

        <ul class="nav navbar-nav" id="nav">
          <li class="active"><a href="{{url('/')}}">Inicio <span class="sr-only">(current)</span></a></li>
          <li><a href="">{{ trans('messages.nosotros') }}</a></li>
          <li><a href="#">{{ trans('messages.servicios') }}</a></li>
          <li><a href="#">{{ trans('messages.galeria') }}</a></li>
          <li><a href="#">{{ trans('messages.artistas') }}</a></li>
          <li><a href="#">Blog</a></li>
          @if(!Auth::guest())

          <li>

            <li>
              <a id="dLabel" data-target="#" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                {{ Auth::user()->name }}
                <span class="caret"></span>
              </a>

              <ul class="dropdown-menu" aria-labelledby="dLabel" style="z-index: 1000000000">
                <li><a href="" class="text-center">Vender una obra</a></li>
                <li><a href="" class="text-center">Configuracion cuenta</a></li>
                <li><a href="{{url('auth/logout')}}" class="text-center">Cerrar sesion</a></li>
              </ul>
            </li>
          </li>

          @endif

          <li>
            <a id="selectlang" data-target="#" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">idioma<span class="caret"></span></a>

            <ul class="dropdown-menu" aria-labelledby="selectlang" style="z-index: 1000000000">

              <li><a href="{{ url('lang', ['en']) }}"><img src="{{ url('images/lang/united-states.png') }}" alt="" /></a></li>
              <li><a href="{{ url('lang', ['es']) }}"><img src="{{ url('images/lang/spain.png') }}" alt="" /></a></li>

            </ul>
          </li>
        </ul>

      </div>





    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>

Cabe destacar que si utilizo

Código:

<li>
            <button id="selectlang" data-target="#" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">idioma<span class="caret"></span></button>

            <ul class="dropdown-menu" aria-labelledby="selectlang" style="z-index: 1000000000">

              <li><a href="{{ url('lang', ['en']) }}"><img src="{{ url('images/lang/united-states.png') }}" alt="" /></a></li>
              <li><a href="{{ url('lang', ['es']) }}"><img src="{{ url('images/lang/spain.png') }}" alt="" /></a></li>

            </ul>
          </li>

En vez de

Código:

<li>
            <a id="selectlang" data-target="#" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">idioma<span class="caret"></span></a>

            <ul class="dropdown-menu" aria-labelledby="selectlang" style="z-index: 1000000000">

              <li><a href="{{ url('lang', ['en']) }}"><img src="{{ url('images/lang/united-states.png') }}" alt="" /></a></li>
              <li><a href="{{ url('lang', ['es']) }}"><img src="{{ url('images/lang/spain.png') }}" alt="" /></a></li>

            </ul>
          </li>

los dropdowns funcionan perfectamente pero esto no va acorde con el diseño que estoy haciendo.



espero su ayuda.

saludos.