この記事でわかる事
  • carrierwaveの複数画像アップロード機能をsimple_formで使う場合のコードの書き方

開発環境

  • Ruby: 2.6.3
  • Rails: 5.2.4

参照記事

ハマった部分

上の記事を読めばわかるように、carrierwaveを使って画像を複数アップロードする場合にいじくるべき部分は次の3つです。

  • 対象のモデル内にImageUploaderをマウントする
  • フォーム内に「multiple: true」を記述する
  • ストロングパラメータにimagesを配列の形で渡す

 

対象のモデル内にImageUploaderをマウントする

# app/models/hoge.rb

class Hoge < ActiveRecord::Base
  mount_uploaders :images, ImageUploader
  serialize :images, JSON
end

...

フォーム内に「multiple: true」を記述する

# app/views/hoges/xxx.html.erb

...

<%= form.file_field :images, multiple: true %>

...

ストロングパラメータにimagesを配列で渡す

# app/controllers/hoges_controller.rb

...

params.require(:hoge).permit(:foo, :bar, images: [])

...

 

これらのうち、僕がハマったのは2つ目の「フォーム内に「multiple: true」を記述する」という部分。

というのも、例文では「form_with」が使われていますが、僕は普段から「simple_form」というgemを使っているのでこのままでは正常に動かなかったのです。

 

じゃあどうすれば良いのか、小一時間ググった結果、英文の記事を見つけて解決に辿り着きました。

参照記事:Using simple_forms simple_field_for with a multipart file uploader for Carrierwave

 

結論から言ってしまうと、simple_form内に「multiple: true」を記述する場合には次のように書かなければならないみたいです。

<%= f.input :images, as: :file, input_html: { multiple: true } %>

 

「input_html: { }」の中に書く感じですね。日本語の情報だとなかなか出てこなかったので、英語での検索の重要性に改めて気づかされました。

 

もし僕と同じような問題にぶつかってしまっている人はぜひとも試してみてください。

完成形

おすすめの記事