【Rails】simple_form使い方基礎

simple_formとは？

入力フォームを簡単に作れるgemのこと。

Railsでフォームを作成するにはform_withやform_forを使えば実装できますが、simple_formというものを使えばより簡単にフォームを作成することができます。

使い方

お決まりのやり方ですが、Gemfileにgemを追記してbundle installし、generateコマンドを実行します。

gem 'simple_form'

$ bundle install

$ rails generate simple_form:install

※bootstrapを適用させたい場合はbootstrapオプションをつけてコマンド実行します。
$ rails generate simple_form:install --bootstrap

ビューの書き方の例は以下のようになります。

sample.html.erb

<%= simple_form_for @user do |f| %>
  <%= f.input :username %>
  <%= f.input :password %>
  <%= f.button :submit %>
<% end %>

ちなみにslimを使った書き方だと次のようになります。

sample.html.slim

= simple_form_for @user do |f|
  = f.input :username
  = f.input :password
  = f.button :submit

かなりシンプルになりましたね！
今回、表示の画面例は用意しておりませんが、普段formを作成した時のようにフォームのラベルと入力用のフォームが作成されます。
ラベルはactiverecord.ja.ymlファイルに日本語訳を書いていれば指定した文字を表示してくれるので、特に指定してあげる必要はありません。

色々なオプションをつけてアレンジする

オプションは属性名の後ろにカンマ区切りで指定していく。

例

<%= simple_form_for @user do |f| %>
  <%= f.input :username, label: "ラベルの名前" %>
<% end %>

■ラベル名の変更
label: 'ラベル名'
※activerecord/ja.ymlに指定した名前より、オプションの方が優先されるようです。
※ラベル名を非表示にしたい場合はlabel: falseをつけましょう

■ヒントをつける
hint: '入力する際のヒントや注意書き'

このように入力フォームの下に入力した文字が表示されます。

■エラーメッセージ（投稿に失敗したときに表示される）
error: '半角英数字で入力してください'

エラーが発生して入力が完了しなかった場合に指定したエラーメッセージを表示させることができます。
例えば入力した属性は半角英数字でしか入力を受け付けていない場合、再度入力してもらう時の手助けとしてhintオプションが役に立ちます。
※railsでは 標準で表示されるエラーメッセージがあるのでそちらを使う方がいいかもしれません。

■エラーメッセージを表示させたくない時
error: false

■フォームに説明書きをしておきたい時
placeholder: '半角英数字で入力してください'

■ファイルの投稿フォームにしたい時
as: :file

参考

ここで紹介したオプションは一部のみです。詳しくはGithubに載っているので、色々試して遊んでみると面白いと思います。
simple_formのGithub