【Rails】form_forでのname属性について解説
ご飯食べた後よくないと分かっていてもベットに横になってしまうのがやめられない。。
今日はform_forでのname属性について簡単にまとめたいと思います。
自分自身もこのname属性ってなんのためにあるんだろうと思って長らくスルーしてたのですが、めちゃくちゃ重要であることに気づきましたので今回のブログのネタに取り上げることにしました。
name属性とは
「フォーム，フレーム，コントロール，オブジェクトなどの多数の要素で， 要素の名前 を指定します。」
とあり様々な要素に対して使用されますが、今回はform_forに絞って進めていこうと思います。
name属性の付け方
１、form要素にname属性を追加する。
= form_for @item, html: {name: 'new_item'} do |f|
デフォルトだとname属性は入らないです。
ここでform_forにname属性をつけるメリットは、Javascriptでform要素を取得するメソッドが使えるようになるからです。
そのメソッドはdocument.forms.(form要素のname名)です。
これにより、form要素をまるごと引っ張ってこれます。
document.forms.(form要素のname名)でform要素を取得し、それをformDataオブジェクトに突っ込んでajax通信したりとめちゃめちゃ便利です！
これはあくまで一例でname属性を追加するメリットはまだまだあると思います。
２、form_forにより生成したinputタグやselectタグにname要素を追加する。
form_forメソッドのfオブジェクトの後に続くメソッドにより対応するHTMLタグを作られます。
これにより作られたinputタグやselectタグにはデフォルトでnameタグがついています。
new.haml.html
= f.text_field :product_name, placeholder: "40字まで", maxlength: "40", class: "exhibition__product--name"
new.haml.htmlにより作られたHTML要素
<input placeholder="40字まで" maxlength="40" class="exhibition__product--name" size="40" type="text" name="item[product_name]" id="item_product_name">
上に示した例のように、name属性を指定しなくても name="item[product_name]"とname属性が付与されています。
form_for @itemのitemとf.text_field :product_nameのproduct_nameを使ってname属性が決められています。
指定しなくても付与されるようになっているのはコントローラーにフォーム情報を送信するときにこのname属性の値をキーとするからです。
つまり、このname属性がないとparamsに値は保存されません。
フォームには値を入力させたいけど、コントローラーには情報を送りたくないときなんかはJavascript側でこのname属性をとってあげるとよいです。
補足
ちなみにrailsドキュメントにある
f.text_field(メソッド名 [, HTML属性 or イベント属性])
で、:product_nameがなぜメソッド名になるんだろうと思っていましたが、下のQittaの記事で直感的に理解できますので、ご参考に。
以上、「form_forでのname属性について解説」の記事でした。
お役に立ったという方はいいねを、なんかここ違うぞという方はコメント頂けるとうれしいです！
ここまで読んでいただきありがとうございました。では！
