フォームを扱うヘルパーメソッド #Rails

Railsを使ったアプリケーション作成の流れと、よく使いそうなフォームを生成するメッセージヘルパーを少しまとめました。

実行環境
ruby 3.0.1
rails 7.1.3

Railsアプリケーションの作成

~/ルートディレクトリ

$ rails new for_form_helper_method -d postgresql

cd for_form_helper_method

$ rails new [任意のアプリケーション名] -d [使用するデータベースアプリケーション名] でアプリケーションを作成し、作成したアプリケーションのディレクトリに移動。

[~/for_form_helper_method]

$ rails g scaffold AccountCreate name:string

$ rails g scaffold [モデル名] [カラム名①:データの型① カラム名②:データの型②・・・] でマイグレーションファイル、モデル、コントローラー、ルーティング、ビューを生成。

$ rails db:create#データベースの作成

$ rails db:migrate#マイグレーションファイルの適用

上記のコマンドを実行し、データベースの作成とマイグレーションファイルの適用をする。

$ rails s コマンドを実行し、アプリケーションサーバを起動。

上記のURLをブラウザで開き、以下の表示になればOK

form_with

form_withメソッドは、基本的に必要なフォームのHTMLを勝手に生成してくれるヘルパーメソッド。作成したアプリケーションのViewファイルを見るとform_withを使って、http://[::1]:3000/account_creates/newにフォームを作成していることがわかる。

[~/app/view/account_creates/_form.html.index]

<%= form_with model: @account_create do |form| %>
#省略

	<div>
    <%= form.label :name, style: "display: block" %>
    <%= form.text_field :name %>
  </div>

[~/app/view/account_creates/new.html.index]

<h1>New account create</h1>

#renderで_form.html.indexを出力
<%= render "form", account_create: @account_create %>
#省略

form_withのモデルオプションを使った書き方は以下の通り。

<%= form_with model: モデルクラスのインスタンス do |form| %>
  フォーム内容
<% end %>

ここでのモデルクラスのインスタンスとは、フォームで記入されたデータを保存したいテーブルのクラスのインスタンスのこと。

今回引数に設定してある@account_createは、AccountCreatesコントローラーで生成したインスタンス。

[~/app/controller/account_creates_controller/rb]

	def new
    @account_create = AccountCreate.new
	end

コントローラーで作成したインスタンスがnewメソッドで新たに作成されて何も情報を持っていなければ自動的にcreateアクションへ、findメソッドなどで作成され、すでに情報を持っている場合はupdateアクションへ自動的に振り分けてくれる。

text_area_tag

複数行のテキストを入力するためのフィールドを作成できる。

form.html.indexにtext_area_tagメソッドを追加。

maxlengthオプションを使うことで上限文字数を設定できる。そのほかにも、カラム数やフォーム幅などを指定できる。

[~/app/view/account_creates/_form.html.index]

#省略

<div>
  <%= form.label :other, "備考", style: "display: block" %>
  <%= text_area_tag :other, nil, maxlength: 100 %>
</div>

  <div>
    <%= form.submit %>
  </div>
<% end %>

link_to

リンクの挿入時に使用する。URLやパスを指定することでリンク先への移動するためのHTMLを作成してくれる。

[~/app/view/account_creates/index.html.index]

<%= link_to "New account create", new_account_create_path %>

基本的な書き方は、<%=link_to “テキスト” "URL” or path %>

date_field

年月日を選択するプルダウンを作成してくれる。

[~/app/view/account_creates/_form.html.index]

<div>
    <%= form.label :birthdate, "生年月日", style: "display: block" %>
    <%= date_field(:user, :born_on) %>
  </div>

telephone_field

電話番号入力欄を作成してくれる。オプションをつけることで文字数制限などを付与できる。

[~/app/view/account_creates/_form.html.index]

<div>
    <%= form.label :phonenumber, "携帯電話番号", style: "display: block" %>
    <%= form.telephone_field :phonenumber, maxlength: 12 %>
  </div>

参考文献

・Railsドキュメント
https://railsdoc.com/
・Railsガイド
https://railsguides.jp/v5.2/form_helpers.html
・Railsヘルパーメソッドのまとめ（よく使うもの）
https://qiita.com/Yukaaaah/items/19e524fd0c0e4a3451f1
・Rails：form_withのオプションや特徴について整理
https://qiita.com/yamaday0u/items/a3689bc48a7eff55929b
・【Rails】 form_withの使い方を徹底解説！
https://pikawaka.com/rails/form_with