CODEWITHSUNDEEP
javascriptjqueryhtmlcsstwitter-bootstrap
DVA
DVA

Reputation: 151

Hide dropdown menu when clicked - Bootstrap

I have a navigation bar in my website and all the links are loading a content in a container through AJAX.

Now, I need to hide the dropdown menu when a link is clicked. That's not the normal behavior of bootstrap.

Here's my code in the fiddle.

$(".dropdown-menu a").click(function() { $(this).closest(".dropdown-menu").prev().toggle(); });

http://jsfiddle.net/fw7vh/158/

I recently browsed into existing answers but it removes the dropdown button. Please advise. Thanks!

Upvotes: 1

Views: 494

Answers (3)

MazzCris
MazzCris

Reputation: 1840

Try with:

$(".dropdown-menu a").click(function() {
    var menu = $(this).closest(".dropdown-menu");
    $(menu).css('display','none');
    setTimeout(function(){
        $(menu).css('display','');
    },200);
});

Upvotes: 2

Sandeeproop
Sandeeproop

Reputation: 1776

You can achieve this easily with replacing your code

$(".dropdown-menu a").click(function() {
  $(this).closest(".dropdown-menu").prev().toggle(); 
});

with this

$(".dropdown-menu a").click(function() { 
   $(document.body).click(); 
});

Here is the working fiddle

Upvotes: 0

Gunasegar
Gunasegar

Reputation: 161

If I understood your question correctly, this might help you.

    $(".dropdown-menu a").click(function() {
    $(this).closest(".dropdown-menu").toggle();
});

Upvotes: 0

Related Questions