twitter bootstrap dropdown button inside dropdown menu

Question

I managed to show a dropdown button inside a dropdown menu of another dropdown button.

Take a look at http://jsbin.com/opepeg/1/edit for what I am trying to achieve.

Now problem is that when I click primary button it works perfectly, but the button inside doesn't show it's menu. What wrong am I doing?

I don't think I've ever seen a Bootstrap dropdown implemented inside a dropdown before so it may just be that it's not possible. — Billy Moat
– Billy Moat, Commented Feb 26, 2013 at 16:25
Nothing is impossible on web. It just needs time and some brain. I made it work. See the link now. — codefreak
– codefreak, Commented Feb 27, 2013 at 11:03

codefreak · Accepted Answer · 2013-02-27 05:52:23Z

2

I solved it by adding:

$(this).parent().toggleClass('open');

to onclick event of tag of innner button. You can see that in jsbin link I provided in question.

Here's modified html:

    <a class="dropdown-toggle btn" data-toggle="dropdown" href="javascript:;" 
onclick="$(this).parent().toggleClass('open');">
      Search by date&nbsp;<span class="caret"></span>
    </a>

and some css:

.btn-group.open .btn-group .btn.dropdown-toggle{
    background-color: #f5f5f5;
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(top, #ffffff, #e6e6e6);
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

answered Feb 27, 2013 at 5:52

codefreak

7,1413 gold badges45 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

twitter bootstrap dropdown button inside dropdown menu

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related