Dropdown Menu doesn't work with Form inside

[mickeyckm]

Hi,

I put in a form with text input inside the

. I need to make some adjustment to the UI but is fine. However, the dropdown-js that comes with bootstrap, doesn't handle it well.

When I click on the textbox, the dropdown menu straightaway closes. Any work around for this?

Cheers,
Mickey

[zachwill]

If you have jQuery on the page, you can run the following to stop the propagation for all elements within the menu (given it's class is menu-dropdown).

var menu = $('.menu-dropdown').find('*');
menu.click(function(e) {
    e.stopPropagation();
});

Alternatively, you could just find the form.

var form = $('.menu-dropdown').find('form');
form.click(function(e) {
    e.stopPropagation();
});

[MattiJarvinen-BA]

@zachwill or even

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