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
.
<%= 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 %>
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'
:hint => 'preço em reais'
:label => 'Nome completo'
:placeholder => 'exemple@email.com'
:collection => 1..5
:as => radio_buttons
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