Bootstrap dos barras de navegación que se derrumban

En bootstrap quiero tener dos barras de navegación debajo de la otra. Mi idea: Navbar 1 tiene una marca: menú principal. Navbar 2 (debajo de navbar1) tiene una marca llamada: submenú.

Cuando el usuario mira el sitio en su teléfono móvil, ve dos barras de navegación plegables. El usuario ahora puede elegir qué barra de navegación para abrir. El menú o el submenú.

Acabo de copiar el código estándar en el sitio web bootstrap:http://getbootstrap.com/components/#navbar

Lo extraño es. Cuando hago mi navegador pequeño. Aparecen dos barras de navegación colapsadas. "Menú principal" y "submenú". Cuando hago clic en el botón detrás del menú principal, aparece el menú principal. Al igual que debería. Pero cuando presiono el botón del submenú (uncollapse). El MENÚ PRINCIPAL se abre de nuevo. No es el submenú.

Acabo de usar el código de la barra de navegación estándar del sitio web bootstrap en el enlace pegado debajo de cada uno y cambié los nombres de marca. AQUÍ está el bootply:http://bootply.com/101690 Pruébelo en el móvil y vea qué sucede en las barras de navegación.

Respuestas a la pregunta(1)

Su respuesta a la pregunta