CODEWITHSUNDEEP
ruby-on-railstwitter-bootstrapruby-on-rails-4tooltiptwitter-bootstrap-rails
Mini John
Mini John

Reputation: 7941

Bootstrap Tooltip in Ruby on Rails

I'm trying to get this done for quite some time now and i can't figure out whats wrong:

My Link: 

<%= link_to '#', tag, class: "tag-tooltip",
                    :data => {:toggle=>"tooltip"},
                    'data-original-title' => "Hey Whats up",
                    'data-placement' => 'right'%>

My Javascript:

$('.tag-tooltip').tooltip();

But it's not working... What am i missing ?

EDIT

If i go into my Chrome Console and insert ($('.tag-tooltip').tooltip();) it is working.

So i guess the js file is not loading ? (I checked my application.js and i'm requiring everything.)

Upvotes: 6

Views: 15397

Answers (3)

Mini John
Mini John

Reputation: 7941

I found out the wrapping which worked:

$(document).on("ready page:change", function() {
  $('.tag-tooltip').tooltip();
});

Update:

$(document).on("turbolinks:load",function(){
  $('.tag-tooltip').tooltip();
})

With vanilla JS

document.addEventListener("turbolinks:load", function() {
  $('.tag-tooltip').tooltip();
});

Upvotes: 7

Ayush Kanoongo
Ayush Kanoongo

Reputation: 31

You need to add some script in your code : 

$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip(
      {container:'body', trigger: 'hover', placement:"right"}
    );   
  });

Upvotes: 0

Gon&#231;alo
Gon&#231;alo

Reputation: 41

In my case the problem was that I was loading jquery-ui after bootstrap-sprockets

In my application.js I changed:

//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require bootstrap-sprockets
//= require jquery-ui

to 

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require turbolinks
//= require bootstrap-sprockets

Then it all started working as it should.

Upvotes: 0

Related Questions