Dropdown menus don't get closed when selecting an option

[lrlopez]

[Tested on Chrome 21, Safari 6 and Firefox 14]

I've upgraded Bootstrap on a test-branch and dropdown menus no longer close automatically once an option is selected. User has to click outside for the menu to disappear.

The problem is reproducible in the official docs: http://twitter.github.com/bootstrap/javascript.html#dropdowns

Did I miss something on the changelog about this new behaviour? If this is a "WON'T FIX", is there any workaround to force them to close?

[kr3l]

I have the same problem. Dropdowns used to close automatically when selecting an option, after upgrade to 2.1.0 they do not close anymore when an option is selected.

[lphm]

I have several dropdown into a navbar and it's always the first initialized who works well. Others do not want to close when I choose (click) an option OR if I click somewhere else on the page to close it.

The problem is here since the 2.1 version.

[jon301]

Hi,

Same problem for me :

http://jsfiddle.net/7ptXA/

[zachlowry]

I've commented on the line of code that caused this here: c9cef74#js/bootstrap-dropdown.js. Change the target for the event to ".dropdown form" and it should be fixed.

[kr3l]

@zachlowry This fixes the issue for me, thanks

[jasonkreider]

Removing "form" from the selector also prevents menu items using rails jquery_ujs from working (e.g. :method => :delete for a sign out link).

[mhuggins]

+1 on this issue

[internalfx]

+1 on this issue

[mfansler]

Here's an interim solution until the 2.1.1 comes through:

$('body')
  .off('click.dropdown touchstart.dropdown.data-api', '.dropdown')
  .on('click.dropdown touchstart.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })

Edit: I should add, in case it's not clear, that this workaround is really only intended for those loading Bootstrap off a CDN. If you're hosting your own code, just fix it directly. :P

[mhuggins]

Thanks for the workaround!

[benrhere]

+1 on this...

[tonybruess]

+1 for me too. Glad I'm not the only one that was confused.

[ShivX]

I'm somewhat confused as to why 4756 was closed - the fix listed above does NOT fix that specific issue?

EDIT: Never mind, probably in reference to 4550

[fat]

added the form bit back, which fixes this – will look into another way of handling the mobile stuff

[mhuggins]

@fat - I'm not seeing the commit in the Github commits that fixes this. Am I missing something?

[mfansler]

@mhuggins It's on the wip branch: https://github.com/twitter/bootstrap/blob/2.1.1-wip/js/bootstrap-dropdown.js

[mhuggins]

Ahh, didn't realize that's how Twitter does it. Thanks!

[ybart]

A temporary workaround can be found here for incompatibilty with jquery-rails while waiting 2.1.1 release : seyhunak/twitter-bootstrap-rails#343

[RusAlex]

the same issue

[marcelometal]

$('.dropdown-menu select, .dropdown-menu textearea').click(function(e) {
e.stopPropagation();
})

[reunix]

perfect marcelometal!!!