Dropdown In Bootstrap Navbar

I am trying this navbar out with a dropdown. When I try to build it into my webservice I don't get the dropdown working. I can click on it but nothing happens there. This is my cur

Solution 1:

Add J query & Bootstrap File

Remove this class collapse

<linkhref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"rel="stylesheet"/><scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script><scriptsrc="http://getbootstrap.com/dist/js/bootstrap.min.js"></script><navclass="navbar navbar-default"style="width: 60%; margin: 0 auto;"><divclass="container-fluid"><divclass="navbar-collapse"id="bs-example-navbar-collapse-1"><ulclass="nav navbar-nav"><li><ahref="#">Foo</a></li><liclass="dropdown"><ahref="#"class="dropdown-toggle"data-toggle="dropdown"role="button"aria-haspopup="true"aria-expanded="false">Bar<spanclass="caret"></span></a><ulclass="dropdown-menu"><lirole="separator"class="divider"></li><li><ahref="#">Foo</a></li><lirole="separator"class="divider"></li><li><ahref="#">Bar</a></li><lirole="separator"class="divider"></li><li><ahref="#">Baz</a></li></ul></li><li><ahref="#">Baz</a></li></ul></div></div></nav>

Solution 2:

Navbar Default navbar Requires JavaScript plugin

If JavaScript is disabled and the viewport is narrow enough that the navbar collapses, it will be impossible to expand the navbar and view the content within the .navbar-collapse.

The responsive navbar requires the collapse plugin to be included in your version of Bootstrap.

Here is the plugin: http://getbootstrap.com/javascript/#collapse

From: http://getbootstrap.com/components/#navbar

Solution 3:

Because you are missing responsive dropdown

HTML

<buttontype="button"class="navbar-toggle collapsed"data-toggle="collapse"data-target="#bs-example-navbar-collapse-1"aria-expanded="false"><spanclass="sr-only">Toggle navigation</span><spanclass="icon-bar"></span><spanclass="icon-bar"></span><spanclass="icon-bar"></span></button>

DEMO HERE