33

Link here: bootstrap button dropdowns

I'd like to disable this button dropdown, i added disabled class to <a> but the dropdown can still be opened by clicking the dropdown button. Any ideas?

1
  • 1
    If you could post some corresponding code.
    – Jai
    Mar 29, 2013 at 5:45

3 Answers 3

52

Add disabled class to the button...

<div class="btn-group">
    <button class="btn btn-primary dropdown-toggle disabled" data-toggle="dropdown">Action <span class="caret"></span></button>
    <ul class="dropdown-menu">
      <li><a href="#">Action</a></li>
      <li><a href="#">Another action</a></li>
      <li><a href="#">Something else here</a></li>
      <li class="divider"></li>
      <li><a href="#">Separated link</a></li>
    </ul>
</div>

That works when editing via bootstraps site. I did notice that they're not using the anchor like their example.

<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
3
  • 2
    Thanks very much for pointing this, i change to use <button> and it works, i think this may be a bug of Bootstrap's doc.
    – Mike
    Mar 29, 2013 at 7:04
  • 7
    Be careful this only makes the button LOOK disabled (regardless of using A or BUTTON tags), the JS functionality remains enabled on many browsers including IE11 and Chrome, see BS3 Docs
    – user9645
    May 10, 2017 at 11:59
  • I would add: in case you are using some other inner element like an icon, remember to disable both of them otherwise the dropdown menu will still show up. Feb 1, 2020 at 3:07
16

Yeah you can do it this way:

$('.dropdown-toggle').data('toggle', '');

This works only when it gets this property: data-toggle="dropdown", You can either change the dropdown to '' blank one.

Or you can try and remove the attr of data-toggle

$('.dropdown-toggle').removeAttr('data-toggle');
0
9

All you need to do is set the disabled property of the button.

$('.dropdown-toggle').prop('disabled', true);

http://getbootstrap.com/2.3.2/base-css.html#buttons Disabled state

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.