先日ポートフォリオを作成時に編集データが下段にずれてしまい、困ったため備忘録として投稿します。
これだけではなんのことかわからないと思うので内容をご確認ください!
def new
@cook = Cook.new
8.times { @cook.materials.build }
end
このような形で新規投稿時に、食材と分量を最大8種類入れることができるようにしています。
#ビュー
div.cook-post-container
div.col-12
= form_with model: cook, local: true do |f|
省略
div.form-group
label for="inputMaterial" ◆材料
span style="font-size:14px;" ※8種類上の場合は調理方法欄に追記
<br>
= f.fields_for :materials do |material_fields|
div.material-container
div.material-box
= material_fields.text_field :material, placeholder: "食材、調味料等", class: "my-2 cook-mobile"
div.qty-box
= material_fields.text_field :qty, placeholder: "分量", class: "my-2 cook-mobile"
<br>
省略
= f.submit "投稿する", class: "w-100 cook-mobile"
親モデルであるCookモデルのform_withにネストする形でfields_forを使用。
#発生した問題
Materialテーブルにおいて、2度目の編集時に1回目に編集したデータが下段にずれる!
(上記のfields_forの中身です)
例)
■新規投稿時
食材 分量
肉 100g
空欄 空欄
空欄 空欄
空欄 空欄
空欄 空欄
空欄 空欄
空欄 空欄
空欄 空欄
■1回目の編集時
食材 分量
肉 100g
塩 5g ←追加
空欄 空欄
空欄 空欄
空欄 空欄
空欄 空欄
空欄 空欄
空欄 空欄
■2回目の編集時
食材 分量
肉 100g
空欄 空欄
空欄 空欄
空欄 空欄
空欄 空欄
空欄 空欄
塩 5g
このように2回目の編集時に1回目に追加した「塩・5g」が下段にずれて表示されてしまっていました。
#解決策
class Material < ApplicationRecord
belongs_to :cook
default_scope { order(:id) } #これを追記
end
default_scope { order(:id) }を記入することでデフォルトの表示順を変更してあげると、更新順に並びます。
※メンターの方いわく、default_scopeは非推奨であるため使用しないほうが良いとのこと
今回の原因はメンターの方が言うにはpostgresqlの仕様とのことでした。
本番環境ではMysqlを使用したため、default_scope { order(:id) }の記載がなくても更新順に表示されました。
#最後に
解決策でdefault_scope { order(:id) }を紹介しましたが、おそらく他にもっと良い方法があります。
私自身は本番環境でMysqlを使用したため他の解決策は探しませんでした!笑
以上です!