Question

I am trying to implement a popover on a form field in a Rails View, using the bootstrap-saas gem.

<%= form_for(@user, :html => { :class => "form-horizontal" }) do |f| %>

  <div class="control-group">
<%= f.label :fname, "First Name", :class => "control-label" %>

    <div class="controls">
  <%= f.text_field :fname, class: "input-large", rel: "popover", :"data-content"=>"Enter First Name" %>
</div>

  </div>

<% end %>

What am I missing with this?

Answer 1

You need to turn on the popover. The most common way is to give the popover a class, and use JS (my example will be with jQuery) to turn it on.

# view
# ...
<%= f.text_field :fname, class: "input-large popover-input", rel: "popover", :"data-content"=>"Enter First Name" %>

(Note the additional class name of popover-input. Call it whatever you’d like.)

# JS
# ...
$(".popover-input").popover();

And voila!

The Bootstrap page for Popovers shows additional options you can use for popovers.