Skip to content

Instantly share code, notes, and snippets.

@evanp
Created September 5, 2013 21:31
Show Gist options
  • Save evanp/6456479 to your computer and use it in GitHub Desktop.
Save evanp/6456479 to your computer and use it in GitHub Desktop.
This is an example of using the JavaScript .dropdown("toggle") method in Bootstrap Because Bootstrap doesn't clear the "open" class on the dropdown parent, it stays open.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test dropdown toggle</title>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css">
</head>
<body>
<div class="dropdown">
<a class="dropdown-toggle" id="dropdownMenu1" href="#">Dropdown trigger</a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
<li role="presentation" class="divider"></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
</ul>
</div>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.js"></script>
<script>
$(document).ready(function() {
$("a.dropdown-toggle").click(function(ev) {
$("a.dropdown-toggle").dropdown("toggle");
return false;
});
$("ul.dropdown-menu a").click(function(ev) {
$("a.dropdown-toggle").dropdown("toggle");
return false;
});
});
</script>
</body>
</html>
@caub
Copy link

caub commented Dec 12, 2015

what about the note in blue here http://getbootstrap.com/javascript/#via-javascript-1?

@tp00012x
Copy link

This doesn't work anymore

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment