前提・実現したいこと
複数画像投稿はできるが1枚だけの投稿だとエラー画面になることを改善したい。
Ruby(Ruby on Rails)で複数画像投稿可能なシステムを作っています。
■複数画像投稿機能を実装中に以下のエラーメッセージが発生しました。
バリデーションをかけると複数画像投稿ができなくなってしまい、image.file_fieldのnameを当初下記だったものを
ruby
1 .input_area 2 = image.file_field :image, multiple: true, name: "album_images[image][], id: "upload-image", class: "upload-image", 'data-image': 0
下記に書き換えてみたところ、今度は投稿が一枚のみだと、エラー画面になり(DBに保存自体はされている)、複数画像投稿はできるようになりました。
ruby
1 .input_area 2 = image.file_field :image, multiple: true, name: "album[album_images_attributes][#{@album.album_images.count}][image]", id: "upload-image", class: "upload-image", 'data-image': 0
発生している問題・エラーメッセージ
ruby
1## 該当のソースコード 2def new 3 @album = Album.new 4 @album.album_images.build 5 end 6 7 def create 8 @album = Album.new(album_params) 9 respond_to do |format| 10 if @album.save 11 params[:album_images][:image].each do |image| 12 @album.album_images.create(image: image, album_id: @album.id) 13 end 14 format.html{redirect_to root_path} 15 else 16 @album.album_images.build 17 format.html{render action: 'new'} 18 end 19 end 20 end
js
1var new_image = $(`<input multiple= "multiple" name="album_images[image][]" class="upload-image" data-image= ${images.length} type="file" id="upload-image">`); 2 input_area.prepend(new_image); 3 }); 4 $(document).on('click', '.delete', function() { 5 var target_image = $(this).parent().parent(); 6 $.each(inputs, function(index, input){ 7 if ($(this).data('image') == target_image.data('image')){ 8 $(this).remove(); 9 target_image.remove(); 10 var num = $(this).data('image'); 11 images.splice(num, 1); 12 inputs.splice(num, 1); 13 if(inputs.length == 0) { 14 $('input[type= "file"].upload-image').attr({ 15 'data-image': 0 16 }) 17 } 18 } 19 })
試したこと
binding.pryをかけてみるとparameterは送られてるように見えており、Javascript側に設定しているnameが違うのかなと思ったのですが、どう書き換えていいのかわからないです、、、
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/05/13 14:18