O menu precisa permanecer aberto enquanto eu clico em qualquer lugar do documento ou da tela, porém, quando eu clicar no dropdown de um segundo menu, ele deve fechar o anterior, e também precisa abrir e fechar clicando no dropdown.
Meu código do bootstrap:
$(function() {
$('.dropdown.opened')
.on({
"shown.bs.dropdown": function() {
this.closable = ($('.dropdown.open').length > 1) ? true : false
},
"click": function() { this.closable = true;
if (($('.dropdown.open').length > 1)) {
$('.dropdown.opened').removeClass('open');
}
},
"hide.bs.dropdown": function() { return this.closable; }
});
});
Veja que na regra estou verificando se existe ao menos 1 aberto, então ele muda o comportamento, de dropdown, porém ele deveria fechar todos os menus quando eu clico em outro qualquer ou no mesmo dropdown, e começar o processo de dropdown novamente.