Bootstrap Dropdown menu is not working

Question

I am having trouble getting my dropdowns to work. I can get the navbar to show up perfectly, but when I click on \"Dropdown\" (either of them) it does not display the dropdo

Answer 1

I faced this while I was using ASP .NET Forms. The solution I used was deleting or commenting out jQuery and Bootstrap references from the <asp:ScriptManager runat="server"> in the master page. It seems it creates a conflict with the jQuery and Bootstrap references that you put in the <header>.

Answer 2

I think it's the matter of the route of your route file. Not the bootstrap nor the JQuery file.

Answer 3

the problem is that href is href="#" you must remove href="#" in all tag

Answer 4

Looks like there is more to be done for Rails 4.

1. Inside you Gemfile add.

   gem 'bootstrap-sass', '~> 3.2.0.2'

as seen here

2. Next you need to run

   $bundle install

This is the part no one has mentioned

Open you config/application.rb file

3. add this right before the second to last end

   config.assets.precompile += %w(*.png *.jpg *.jpeg *.gif)

as seen here about a 20% down the page.

4. Next create a custom.css.scss file in this directory

   app/assets/stylesheets

as seen here a little further down from the above task

5. Inside that file include

   @import "bootstrap";

---

Now stop your server and restart and everything should work fine.

I tried to run bootstrap without using a gem but it didn't work for me.

Hope that helps someone out!

Answer 5

For Bootstrap 4 you need an additional library. If you read your browser console, Bootstrap will actually print an error message telling you that you need it for drop down to work.

Error: Bootstrap dropdown require Popper.js (https://popper.js.org)

Answer 6

in angular projects we add angular-cli.json or angular.json theses lines:

      "scripts": [
    "../node_modules/jquery/dist/jquery.min.js",
    "../node_modules/bootstrap/dist/js/bootstrap.min.js"

  ],