13
17

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 3 years have passed since last update.

【Rails】form_withについて簡単にまとめた

Posted at

#はじめに
form_withについて使いかたを簡単にまとめてみました。
今回はRubyonRailsAPIを色々と参照しました。

#form_withの機能
フォームを構成するヘルパーメソッド。form_tagform_forと同じような挙動をするが、
現在はform_withを使用することが推奨されている。

基本的な構文は下記のとおり。

= form_with model: @user do |f|
  = f.text_field :name
  = f.submit '登録'

テキストフィールドに名前を入力して「登録」をおすとデータが送信される。
このとき、データはハッシュの階層構造であるparams[:user][:name]という形で送信される。
よってコントローラーでストロングパラメーターを用いる際は下記のようになる。

def user_params
  params.require(:user).permit(:name)
end

データの送信先については、:urlオプションを追加することによっても指定できるが、
渡されたモデルの状態(①新規②既存)によって自動推定をしてくれる。

①新規作成されたモデルが渡された場合
= form_with model: User.new do |f|
  = f.text_field :name
①で生成されるHTML
<form action="/users" method="post" data-remote="true">
  <input type="text" name="user[name]">
</form>
②既存のモデルが渡された場合
= form_with model: User.first do |f|
  = f.text_field :name
②で生成されるHTML
<form action="/users/1" method="post" data-remote="true">
  <input type="hidden" name="_method" value="patch">
  <input type="text" name="user[name]" value="<the name of the user>">
</form>

①のパターンでは、action="/users"であるのに対して、
②のパターンではaction="/users/1"となっている上に隠しinputフィールドを利用してメソッドをPatchに指定している。
これにより、上記①②のパターンでそれぞれ対応するアクションがcreateになったりupdateになったりする。

###ビュー上に表示しないものを送信したいとき
hidden_fieldを使用することに対応可能。

= form_with model: @user do |f|
  = f.hidden_field :age, :value => @user.age #ビューに表示されない
  = f.text_field :name
  = f.submit

上記のように記載をすることで、ビュー上には表示されないがparams[:user][:age]の中に
@user.ageの値を格納した状態でデータを送ることができる。

###ビュー上に表示させたいが編集はさせたくないとき
readonly: trueを指定すればOK。

= form_with model: @user do |f|
  = f.text_field :name
  = f.text_field :age, value: @user.age, readonly: true #ビューに表示されるが編集不可
  = f.submit

#まとめ
form_withの仕組みが腹落ちしました。
特にモデルの状態の違いから生成されるhtmlが変わり、結果として対応するアクションが自動的に決まる仕組みのあたりは今まで曖昧な理解だったので今回がいい機会になりました。

13
17
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
13
17

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?