Rails 4 - Bootstrap Popovers - js not working

Question

I'm trying to figure out how to get popovers working in my Rails 4 app.

I have bootstrap-sass gem in my app. In accordance with the documentation, I have included the following in my application.js file:

/= require jquery
//= require bootstrap

I have also tried swapping the require bootstrap for require bootstrap-sprockets (but it makes no difference).

I have another file in my javascripts folder called organisations.js.coffee, with:

$('label-with-popover').popover(placement: 'right')

In my view, I'm trying to get a popover working, I have:

<button type="button"  class="label-with-popover" class="btn btn-default" data-toggle="popover" data-placement="top" data-content="netwerewerwrwe" data-title="test"><i class="fa fa-info-circle"></i></button>

When I try this, the button does nothing when I click on it.

Can anyone see what needs to happen to get this working? I'm not sure if I'm supposed to put script tags around the line i have in the coffee file. I tried it, but it makes no difference to this problem.

Answer 1

You are not using the proper selector in your jQuery so the popover is not being applied to the right class. You need:

$('.label-with-popover').popover(placement: 'right');

Before you were just selecting an element called label-with-popover which doesn't exist. You need to be selecting the class .label-with-popover