bootstrap / javascript下拉菜单在heroku上不起作用

Question

I have and app that functions fine on my local machine, however, when i deploy it to heroku the dropdown menu on the navbar refuses to work... here is the code for the dropdown

  <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> Learning Wellness <span class="caret"></span> </a> <ul class="dropdown-menu"> <li><% yield (:exercise)%><%= link_to "Exercise", exercise_path%></li> <li><% yield (:eating_healthy)%><%= link_to "Eating Healthy", eating_healthy_path%></li> <li><% yield (:safety)%><%= link_to "Safety", safety_path%></li> <li><% yield (:health_awareness)%><%= link_to "Health & Awareness", health_awareness_path%></li> </ul> </li> <script type="text/javascript"> $('.dropdown-toggle').dropdown() </script> 

I have already set all of the assets to precompile, and I have tried doing it by hand. Not sure why it isn't working

EDIT:

application.js

 //= require turbolinks //= require_tree . //= require jquery //= require jquery_ujs //= require bootstrap-sprockets //= require bootstrap //= require jquery.slick //= require initialize 

Answer 1

you nee to add the document.ready function:

$( document ).ready(function() {
    $('.dropdown-toggle').dropdown();
});

instead of

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

Regards!