Customizing simple_form and bootstrap

gistfile1.md

Customization

  <%= f.input :state, :collection => ['SA', 'WA'] %>

  <%= f.input :state,
              :as => :radio_buttons,
              :collection => ['SA', 'WA'],
              :item_wrapper_class => 'inline' %>

  <label class="radio_buttons optional control-label">State</label>

  <style type="text/css">
    .my_class { display: inline; }
  </style>

  <div class="controls">
    <%= f.collection_radio_buttons(
      :state, [['SA', 'SA'], ['WA', 'WA']], :first, :last
    ) do |b|
      b.label(:class => 'my_class') { b.text.html_safe + ' ' + b.radio_button }
    end %>
  </div>

Custom inputs

inputs are the :as thing

# app/inputs/currency_input.rb
class CurrencyInput < SimpleForm::Inputs::Base
  def input
    "<span class="add-on">$</span> #{@builder.text_field(attribute_name, input_html_options)}".html_safe
  end
end

f.input :money, :as => :currency

Custom components

are used in the wrappers

# config/initializers/simple_form.rb

SimpleForm.setup do |config|

  config.wrappers :bootstrap_tooltip, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
    b.use :placeholder
    b.use :label
    b.use :tooltip
    b.wrapper :tag => 'div', :class => 'controls' do |input|
      input.use :input
      input.use :error, :wrap_with => { :tag => 'p', :class => 'help-block' }
      input.use :hint,  :wrap_with => { :tag => 'p', :class => 'help-block' }
    end
  end

end

# initializers/simple_form/tooltip_component.rb

module SimpleForm
  module Components
    module Tooltip
      def tooltip
        if options[:tooltip].present?
          tooltip = options[:tooltip]
          tooltip_content = tooltip.is_a?(String) ? tooltip : translate(:tooltips)
          tooltip_content.html_safe if tooltip_content

          template.content_tag(:span, :class => 'tooltip', :"data-content" => tooltip_content) do
            template.content_tag(:i, '', :class => 'icon-question-sign')
          end
        end
      end
    end
  end
end

SimpleForm::Inputs::Base.send(:include, SimpleForm::Components::Tooltip)