CODEWITHSUNDEEP
javascriptangularjstwitter-bootstrap
CMS
CMS

Reputation: 285

Bootstrap Dropdown

I can't get this bootstrap dropdown code to "dropdown".

I am running this in a MEAN (angular js) environment.

The html works perfectly, but there is no "dropdown" element to it. enter image description here

<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown">Change Customer<span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#!">Customer</a></li>
<li><a href="#!">Customer</a></li>
<li><a href="#!">Customer</a></li> 
</ul>
</li>

Why does the dropdown functionality not appear?

Upvotes: 3

Views: 364

Answers (2)

sparaflAsh
sparaflAsh

Reputation: 656

Try to check there's everything you need in your file.

Somewhere in your html there should be this (if you're using CDN):

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" integrity="sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css" integrity="sha384-aUGj/X2zp5rLCbBxumKTCw2Z50WgIr1vs/PFN4praOTvYXWlVyh2UtNUU0KAUhAX" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" integrity="sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin="anonymous"></script>

Source for code is obviously here.

The best practice is to put it at the end of the html file for reducing loading time.

Upvotes: 0

Programmer
Programmer

Reputation: 453

It's because you did not included Bootstrap javascript

add this at the end of your body section

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

Upvotes: 2

Related Questions