12
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

初学者向け)form_withの使い方とオプション(model,local:true)について

Last updated at Posted at 2023-10-09

はじめに

私自身がform_withが何であるか、local:trueとは何なのか理解せずに躓いてしまったので、初学者の方々にform_withについての理解の一助になればと思い投稿しました。
(記事の内容について不備等あれば、ご意見等いただけると幸いです)

目次

タイトル 備考  
1 form_withの紹介 どんなことができるのか、form_tagform_forとの違い
2 form_withの構文 使い方と引数、オプションについて
3 最後に 
4 参考文献  今回参考にした文献

form_withの紹介

(1)どんなことができるのか
ヘルパーメソッドの一つで、入力フォーム(テキスト、検索、パスワードなど)を作成することができます。

(2)form_tagform_forとはどう違うのか

Rails 5.1でform_withが導入されるまでは、form_withの機能はform_tagとform_forに分かれていました。form_tagおよびform_forは、禁止ではないものの、利用は推奨されていません。
「参考文献:Railsガイドより」

以前までは、検索フォームのようにmodelが無い場合はform_tagを使用し、反対にmodelが有る場合はform_forを使用していたようですが、これらが統合されて現在は、form_withを推奨されているようです。

form_withの構文

使い方

viewに記載
form_with(model or url,[scope:],[オプション]) do |f(form)|

例)ユーザーの登録(簡易)

app/view/hoge.erb
<%= form_with model: @user, local: true do |f| %>
    <%= f.text_field :name %>
    <%= f.email_field :email %>
    <%= f.password_field :password %>
    <%= f.submit '登録' %>
<% end %>

この場合、下記のようなフォームを作成できます。
image.png

引数について

(1)model

:model引数を使うと、フォームビルダーオブジェクトをモデルオブジェクトに紐付けできるようになります。つまり、フォームはそのモデルオブジェクトを対象とし、そのモデルオブジェクトの値がフォームのフィールドに自動入力されるようになります。
「参考文献:Railsガイドより」

つまり、Railsが自動的にフォームに入れたもの(上記だと、名前、email、パスワード)とオブジェクト(@user)を紐付てくれます。
また、Railsが自動で適切なURLを判別してくれる機能もあり、例えば、ユーザーが登録されてなければ新規登録へ、すでに登録済みなら更新へという形で判別してくれます。

(2)url
url:new_userのように、特定のURLを指定してフォームデータを送信できる

(3)scope
フォームフィールドのname属性にプレフィックス(接頭辞)を指定してグループ化できるもの。
以下の方が詳しく解説してくれてますので、参考にされてください。
https://endoakak.hatenablog.com/entry/2020/08/29/200000

(4)オプション
local:true:同期通信を使う場合に使います。
(Rails 5.1〜6.0 = 非同期通信(Ajax)がデフォルト、Rails 6.1 = 同期通信がデフォルトのようです)

【同期通信ではない場合どうなるか(体験談)】
フォーム送信後にリダイレクトした際に、バリデーションが表示されない・投稿を新規作成したのに一覧に表示されないなど、ページ全体を更新したい時に更新がされません

なお、ほかにも、GETとPOST以外のHTTPメソッドを使う時に使用する:methodなどのオプションもあります。

最後に

備忘録のような形になりましたが、引数でmodelを使うことのメリットやlocal:trueの使い方について理解が少しでも深まればと思います。

参考文献

12
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
12
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?