module ExtForm::Helpers::FormHelper

Public Instance Methods

auto_complete(object_name, method, options={}) click to toggle source

JS auto complete feature using twitter typeahead.js, pass options through data.

object_name - the object name of form builder method - method of object options - all options are as same as text field.

data  -
  dataset - see: https://github.com/twitter/typeahead.js#api
  mapping - A hash represents that the datum selected maps to inputs in the form, when you want select
            a result and put some values relative to the other fields at the same time, you can use it.
            format: {datum_name: 'input_id', datum_name2: 'input_id2'}

Example:

<%= ext_form_for(@order) do |f| %>
   <%= f.hidden_field :customer_id %>
   <%= f.inputs do %>
     <%= f.input :customer, as: :auto_complete, input_html: {
       data: {
         dataset: {
           name: 'customer',
           local: [
             {id: 1, value: 'customer1', address: 'address1'},
             {id: 2, value: 'customer2', address: 'address2'},
             {id: 3, value: 'customer3', address: 'address3'},
             {id: 4, value: 'customer4', address: 'address4'}
           ]
         },
         mapping: {
            id: 'order_customer_id',
            address: 'order_customer_address'
         }
       }
     } %>
     <%= f.input :customer_address %>
   <% end %>
<% end %>

When you select a customer, id will be put into hidden field whose id is “order_customer_id”, address will be put into text field whose id is “order_customer_address”.

If you input an invalid customer name, relative fields will be cleared.

# File lib/ext_form/helpers/form_helper.rb, line 156
def auto_complete(object_name, method, options={})
  ExtForm::Helpers::Tags::AutoComplete.new(object_name, method, self, options).render
end
collection_select2(object_name, method, collection, value_method, text_method, options={}, html_options={}) click to toggle source
# File lib/ext_form/helpers/form_helper.rb, line 160
def collection_select2(object_name, method, collection, value_method, text_method, options={}, html_options={})
  ExtForm::Helpers::Tags::CollectionSelect.new(object_name, method, self, collection, value_method,
                                               text_method, options, html_options).render
end
dt_picker(object_name, method, options={}) click to toggle source

Use bootstrap-datetimepicker instead of date_select or time_select

object_name - the object name of form builder method - method of object options - all options are as same as text field.

data -
  format      - yyyy-mm-dd, yyyy/mm/dd.....
  week_start  - 0-6
  start_date  - can't pick the date before the start_date.
  end_date    - can't pick the date after the end_date.
  view_mode   - 0..month,1..year,2..10 years
  min_view_mode   - not be tested....
  language    - default pt-BR, see bootstrap-datetimepicker API
  mask_input  - true, false disables the text input mask
  pick_date   - true, false disables the date picker
  pick_time   - true, false disables de time picker
  pick_12_hour_format - false, true enables the 12-hour format time picker
  pick_seconds        - true

Example:

You can use 3 types of dt_picker: date_picker, time_picker, dt_picker.

ext_form would guess the input_type.
The field name ends with '_date' will be set to date_picker.
The field name ends with '_at' or '_time' will be set to dt_picker.

<%= ext_form_for(@project, l: {layout: '1:1:1'}) do |f| %>
   <%= f.inputs do %>
     <%= f.input :estimated_start_date %>
   <% end %>
<% end %>

will produce:

<div class="input-append">
  <input class="span3 date_picker optional"
         data-format="yyyy-MM-dd"
         data-language="zh-CN"
         data-pick-time="false"
         id="project_estimated_start_date"
         name="project[estimated_start_date]"
         type="text" value="2013-09-12" />
  <script>
  //<![CDATA[
    $ (function() { $ ('#order_header_order_date').trigger('dt_picker_load'); });
  //]]>
  </script>
  <span class="add-on"><i data-date-icon="icon-calendar" data-time-icon="icon-time"></i></span>
</div>

When page is loaded, datetimepicker will be automatically loaded.
# File lib/ext_form/helpers/form_helper.rb, line 112
def dt_picker(object_name, method, options={})
  ExtForm::Helpers::Tags::DtPicker.new(object_name, method, self, options).render
end
ext_fields_for(record_name, record_object = nil, options = {}, &block) click to toggle source

Wrapper for using ExtForm inside a rails form. you shouldn’t use ext_fields_for directly yet, it is not tested now. TODO: this feature needs to be tested.

Example:

form_for @user do |f|
  f.text_field :username
  f.text_field :email
  ext_fields_for @post, l: {layout: '1'} do |posts_form|
    posts_form.inputs do
      posts_form.input :title
      posts_form.input :content
    end
  end
end
# File lib/ext_form/helpers/form_helper.rb, line 53
def ext_fields_for(record_name, record_object = nil, options = {}, &block)
  options, record_object = record_object, nil if record_object.is_a?(Hash) && record_object.extractable_options?
  redefine_options(options)
  simple_fields_for(record_name, record_object, options, &block)
end
ext_form_for(record, options = {}, &block) click to toggle source

Helper that wrapped simple_form_for and layout management.

record - an object extending ActiveRecord::Base options - add option l , the others are as the same as the

simple_form_for
:l - layout options
     :layout      - it 's a string ,specify the scale of
                    columns.
                    for example: '1:1', '1:2', '1:1:1'
     :spacing     - left and right padding of form, should be
                    number or percentage.
     :label_width - label width of input, should be number or
                    percentage.
     :max_width   - max width of form, should be number or
                    percentage.      -

Example:

<%= ext_form_for(@project, l: {layout: '1:1:1'}) do |f| %>
   <%= f.inputs do %>
     <%= f.input :name %>
     <%= f.input :description %>
   <% end %>
<% end %>
# File lib/ext_form/helpers/form_helper.rb, line 32
def ext_form_for(record, options = {}, &block)
  redefine_options(options)
  simple_form_for(record, options, &wrapped_inputs(&block))
end
grouped_collection_select2(object_name, method, collection, group_method, group_label_method, option_key_method, option_value_method, options={}, html_options={}) click to toggle source
# File lib/ext_form/helpers/form_helper.rb, line 165
def grouped_collection_select2(object_name, method, collection, group_method,
    group_label_method, option_key_method, option_value_method, options={}, html_options={})
  ExtForm::Helpers::Tags::GroupedCollectionSelect.new(object_name, method, self, collection, group_method,
                                                      group_label_method, option_key_method,
                                                      option_value_method, options,
                                                      html_options).render
end

Private Instance Methods

bootstrap_wrapper(f, layout, &block) click to toggle source
# File lib/ext_form/helpers/form_helper.rb, line 211
def bootstrap_wrapper(f, layout, &block)
  spacing = layout.layout_config[:spacing]
  [(content_tag('div', ' ', class: "left-spacing span#{spacing}") if spacing.to_i > 0),
   content_tag('div', nil, class: "all-inputs span#{layout.actual_width}") { capture(f, &block) },
   (content_tag('div', ' ', class: "right-spacing span#{spacing}") if spacing.to_i > 0)
  ].compact.join.html_safe
end
default_wrapper(f, layout, &block) click to toggle source
# File lib/ext_form/helpers/form_helper.rb, line 199
def default_wrapper(f, layout, &block)
  spacing = layout.layout_config[:spacing]
  suffix = layout.layout_config[:measure]

  content_tag('div', nil,
              class: 'all-inputs',
              style: "padding-left: #{spacing}#{suffix}; padding-right: #{spacing}#{suffix}; "\
                     "width: #{layout.actual_width}#{suffix};") do
    capture(f, &block)
  end
end
redefine_options(options={}) click to toggle source
# File lib/ext_form/helpers/form_helper.rb, line 175
def redefine_options(options={})
  options[:builder] ||= ExtForm::Builders::FormBuilderBase
  options[:wrapper] ||= ExtForm.default_wrapper
  options[:html] ||= {}
  new_class = []
  new_class << options[:html].delete(:class)
  new_class << ExtForm.form_class
  options[:html][:class] = new_class.compact.join(' ')
end
wrapped_inputs(&block) click to toggle source
# File lib/ext_form/helpers/form_helper.rb, line 185
def wrapped_inputs(&block)
  proc { |f|
    layout = f.l
    output = []
    if f.l.instance_of?(ExtForm::Layouts::DefaultLayout)
      output << default_wrapper(f, layout, &block)
    else
      output << bootstrap_wrapper(f, layout, &block)
    end
    output << after_nested_form_callbacks
    output.compact.join.html_safe
  }
end