概要
SimpleForm aims to be as flexible as possible while helping you with powerful components to create your forms. The basic goal of simple form is to not touch your way of defining the layout, letting you find the better design for your eyes. Most of the DSL was inherited from Formtastic, which we are thankful for and should make you feel right at home.
インストール
Gemfile に以下を記述し、
gem 'simple_form'
以下を実行
$ bundle
さらに以下を実行
$ rails generate simple_form:install
設定
後で書く
使い方
基本
<%= simple_form_for @user do |f| %>
<%= f.input :username %>
<%= f.input :password %>
<%= f.button :submit %>
<% end %>
label や hint、 placeholder を上書きできる
<%= simple_form_for @user do |f| %>
<%= f.input :username, :label => 'Your username please' %>
<%= f.input :password, :hint => 'No special characters.' %>
<%= f.input :email, :placeholder => 'user@domain.com' %>
<%= f.button :submit %>
<% end %>
label や hint、 error を無効にすることもできる
<%= simple_form_for @user do |f| %>
<%= f.input :username, :label_html => { :class => 'my_class' } %>
<%= f.input :password, :hint => false, :error_html => { :id => 'password_error'} %>
<%= f.input :password_confirmation, :label => false %>
<%= f.button :submit %>
<% end %>
どんな html 要素も :input_html によって付け加えることができる
<%= simple_form_for @user do |f| %>
<%= f.input :username, :input_html => { :class => 'special' } %>
<%= f.input :password, :input_html => { :maxlength => 20 } %>
<%= f.input :remember_me, :input_html => { :value => '1' } %>
<%= f.button :submit %>
<% end %>
すべての input 要素に同じオプション(例: デフォルトの class)を渡したい場合は、
:defaults オプションが simpleformfor に対して使える。
<%= simple_form_for @user, :defaults => { :input_html => { :class => 'default_class' } } do |f| %>
<%= f.input :username, :input_html => { :class => 'special' } %>
<%= f.input :password, :input_html => { :maxlength => 20 } %>
<%= f.input :remember_me, :input_html => { :value => '1' } %>
<%= f.button :submit %>
<% end %>
SimpleForm は label と input の周りにラッパーとなる div を生成するんだけど、
:wrapper_html というオプションを使ってそれに html 属性を付け加えることができる
<%= simple_form_for @user do |f| %>
<%= f.input :username, :wrapper_html => { :class => 'username' } %>
<%= f.input :password, :wrapper_html => { :id => 'password' } %>
<%= f.input :remember_me, :wrapper_html => { :class => 'options' } %>
<%= f.button :submit %>
<% end %>
デフォルトではすべての input は必須項目となっていて、
それは * が label に付くことを意味するが、
どの input でもそれを無効にすることができる
<%= simple_form_for @user do |f| %>
<%= f.input :name, :required => false %>
<%= f.input :username %>
<%= f.input :password %>
<%= f.button :submit %>
<% end %>
デフォルトの input タイプを上書きすることができる
<%= simple_form_for @user do |f| %>
<%= f.input :username %>
<%= f.input :password %>
<%= f.input :description, :as => :text %>
<%= f.input :accepts, :as => :radio_buttons %>
<%= f.button :submit %>
<% end %>
:disabled オプションを使って input 要素を無効にすることができる
<%= simple_form_for @user do |f| %>
<%= f.input :username, :disabled => true, :hint => 'You cannot change your username.' %>
<%= f.button :submit %>
<% end %>
SimpleForm は Rails のヘルパーと一致するオプションを受け付ける
<%= simple_form_for @user do |f| %>
<%= f.input :date_of_birth, :as => :date, :start_year => Date.today.year - 90,
:end_year => Date.today.year - 12, :discard_day => true,
:order => [:month, :year] %>
<%= f.button :submit %>
<% end %>
label, hint, inputfield, error, fullerror といったヘルパーを直接使うこともできる
<%= simple_form_for @user do |f| %>
<%= f.label :username %>
<%= f.input_field :username %>
<%= f.hint 'No special characters, please!' %>
<%= f.error :username, :id => 'user_name_error' %>
<%= f.full_error :token %>
<%= f.submit 'Save' %>
<% end %>
(他にもトピックいっぱい)
Collections
Priority
Wrapper
アソシエーション
ボタン
Rails のフォームヘルパーをラップする
特別なヘルパー
マッピング
カスタム input
カスタムフォームビルダー
i18n
HTML 5 Notice