CODEWITHSUNDEEP
javascriptcsstwitter-bootstrapsimple-form
Don Giulio
Don Giulio

Reputation: 3294

simple_form hints as tooltip

I'm trying to have my simple_form hints appear as twitter-bootstrap tooltips, so that the hint only appears when the user selects the input field or hovers on it.

The form item would look like (in haml): 

:ruby 
  title = <<TITLE
    This text is normally hidden and pops up as a bootstrap tooltip 
    only when the user hovers on the input field.
  TITLE
= f.input :opt_out, hint: title

My CSS and Javascript for the hint of simple_form are vanilla, so I think I have to modify the config/initializers/simple_form.rb initializer file: 

b.use :hint,  :wrap_with => { :tag => :span, :class => :hint }

Upvotes: 0

Views: 907

Answers (1)

Don Giulio
Don Giulio

Reputation: 3294

I solved it in this way: 

    :ruby 
      title = <<TIT 
        This text is normally hidden and pops up as a bootstrap tooltip 
only when the user hovers on the input field.
      TIT
      link = link_to "what's this?", "", rel: "tooltip", title: title, data: {placement: "right"}
      label = "Opt out #{link}"
    = f.input :opt_out, label: raw(label)

Upvotes: 1

Related Questions