SimpleForm

O SimpleForm é um gem que simplifica drasticamente a criação de formularios.

Para utiliza-lo, adicione no o SimpleForm no Gemfile

gem 'simple_form'

Depois execute o comando para instalar o gem:

$ bundle install

Para iniciar o SimpleForm no projeto, execute o comando:

$ rails g simple_form:install

Esse comando ira criar alguns arquivos no projeto e instalar o SimpleForm. Também é possivel passar a variavel --bootstrap para inicializar o SimpleForm preparado para o Twitter Bootstrap.

Para utilizar o Simple Form, em vez de usar a função form_for, vamos usar a função simple_form_for.

Exemplo de formulário com o SimpleForm

<%= simple_form_for(@product) do |f| %>
  <%= f.error_notification %>
  <%= f.input :name %>
  <%= f.input :price, hint: "price should be in USD" %>
  <%= f.input :released_on, label: "Release Date" %>
  <%= f.input :discontinued %>
  <%= f.input :rating, collection: 1..5, as: :radio_buttons %>
  <%= f.association :publisher %>
  <%= f.association :categories, as: :check_boxes %>
  <%= f.error :base %>
  <%= f.button :submit %>
<% end %>

Funções

input
Input padrão que vai ser definido pelo tipo de variavel definida no modelo.
Exemplo:f.input :name
association
Utilizado para associações. Automaticamente coloca as associações possiveis na lista do formulario. Exemplo: f.association :categories
button
Utilizado para enviar o formulario.
Exemplo: f.button :submit
error_notification
Retorna as mensagens flash de erro e sucesso.
Exemplo: f.error_notification
error
Retorna o erro de validação de um campo especifico.
Exemplo: f.error :username, :id => 'user_name_error'

Variaveis

:hint => 'preço em reais'
:label => 'Nome completo'
:placeholder => 'exemple@email.com'
:collection => 1..5
:as => radio_buttons

Custom Wrappers

O simple_form envolve os campos do formulario em divs. Para criar seus proprios wrappers, adicione a seguinte função no arquivo config/initializers/simple_form.rb:

config.wrappers :basic, :tag => :span do |b|
    b.use :placeholder
    b.use :label_input
    #component.use :hint,  :wrap_with => { :tag => :span, :class => :hint }
    #component.use :error, :wrap_with => { :tag => :span, :class => :error }
  end

Depois para utilizar esse wrapper:

f.input :email, wrapper: "basic", label: false

Links

voltar

SimpleForm.md 2.8KB Permalink History Raw