Do the Bootstrap dropdown close when clicking another dropdown in the same menu?

Question

Do the Bootstrap dropdown close when clicking another dropdown in the same menu?

Navigation

#1 by (0 votes)
#2 by (0 votes)
#3 by (-1 votes)

3

The menu must remain open while I click anywhere on the document or screen, but when I click on the dropdown of a second menu, it should close the previous menu, and also need to open and close by clicking the dropdown.

My bootstrap code:

 $(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; }
    });
 });

See that in the rule I'm checking if there is at least 1 open, then it changes the behavior, dropdown, however it should close all the menus when I click on any other or the same dropdown, and start the dropdown process again .

View menu in JSIDDLE

javascript jquery twitter-bootstrap menu dropdown

asked by anonymous 14.04.2016 / 14:30

3 answers

0

One workaround: Remove% check from%

$(function() {

$('.dropdown.opened')
.on({
    "shown.bs.dropdown": function() { this.closable = ($('.dropdown.open').length > 1) ? true : false },
    "click":             function() { this.closable = true; 
       $('.dropdown.opened').removeClass('open');

    },
    "hide.bs.dropdown":  function() { return this.closable; }
})

});

See the menu in JSIDDLE

14.04.2016 / 15:20

-1

As a parameter of removeClass, the string 'opened' must be passed. If you remove the 'open' class, it will get stuck. Here's the fiddle:

link

(I changed our friend above)

14.04.2016 / 17:02

How to update the table (bootstrap-table) via JS after registration? FastReport prints white space. (Delphi 2010)

score 0 · Accepted Answer

I solved the problem, just triggered the button:

$(function() {
    $('.dropdown.opened')
    .on({
        "shown.bs.dropdown": function() { 
            this.closable = ($('.dropdown.open').length > 1) ? true : false 
         },
        "click":             function() { this.closable = true; 
        $('.dropdown.opened.open').trigger('click');

        },
        "hide.bs.dropdown":  function() { return this.closable; }
    });
 });