Carrierwave kullanarak 4 çoklu görüntü veya dosya yükleme rayları

Rails 4 ve CarrierWave kullanarak bir dosya seçim penceresinden birden fazla görüntüyü nasıl yükleyebilirim? Bir post_controllerve post_attachmentsmodelim var. Bunu nasıl yapabilirim?

Birisi bir örnek verebilir mi? Buna basit bir yaklaşım var mı?

Bu, taşıyıcı dalgayı kullanarak raylarda 4 sıfırdan birden fazla görüntü yüklemek için bir çözümdür

Veya çalışma demosunu bulabilirsiniz: Multiple Attachment Rails 4

Yapmak için sadece şu adımları izleyin.

rails new multiple_image_upload_carrierwave

Gem dosyasında

gem 'carrierwave'
bundle install
rails generate uploader Avatar 

İskele sonrası oluşturun

rails generate scaffold post title:string

Post_attachment iskele oluştur

rails generate scaffold post_attachment post_id:integer avatar:string

rake db:migrate

Post.rb içinde

class Post < ActiveRecord::Base
   has_many :post_attachments
   accepts_nested_attributes_for :post_attachments
end

Post_attachment.rb içinde

class PostAttachment < ActiveRecord::Base
   mount_uploader :avatar, AvatarUploader
   belongs_to :post
end

Post_controller.rb içinde

def show
   @post_attachments = @post.post_attachments.all
end

def new
   @post = Post.new
   @post_attachment = @post.post_attachments.build
end

def create
   @post = Post.new(post_params)

   respond_to do |format|
     if @post.save
       params[:post_attachments]['avatar'].each do |a|
          @post_attachment = @post.post_attachments.create!(:avatar => a)
       end
       format.html { redirect_to @post, notice: 'Post was successfully created.' }
     else
       format.html { render action: 'new' }
     end
   end
 end

 private
   def post_params
      params.require(:post).permit(:title, post_attachments_attributes: [:id, :post_id, :avatar])
   end

Views / posts / _form.html.erb'de

<%= form_for(@post, :html => { :multipart => true }) do |f| %>
   <div class="field">
     <%= f.label :title %><br>
     <%= f.text_field :title %>
   </div>

   <%= f.fields_for :post_attachments do |p| %>
     <div class="field">
       <%= p.label :avatar %><br>
       <%= p.file_field :avatar, :multiple => true, name: "post_attachments[avatar][]" %>
     </div>
   <% end %>

   <div class="actions">
     <%= f.submit %>
   </div>
<% end %>

Herhangi bir gönderi için bir eki ve ek listesini düzenlemek için. Views / posts / show.html.erb'de

<p id="notice"><%= notice %></p>

<p>
  <strong>Title:</strong>
  <%= @post.title %>
</p>

<% @post_attachments.each do |p| %>
  <%= image_tag p.avatar_url %>
  <%= link_to "Edit Attachment", edit_post_attachment_path(p) %>
<% end %>

<%= link_to 'Edit', edit_post_path(@post) %> |
<%= link_to 'Back', posts_path %>

Ek görünümlerini / post_attachments / _form.html.erb düzenlemek için formu güncelleyin

<%= image_tag @post_attachment.avatar %>
<%= form_for(@post_attachment) do |f| %>
  <div class="field">
    <%= f.label :avatar %><br>
    <%= f.file_field :avatar %>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

Post_attachment_controller.rb'deki güncelleme yöntemini değiştirin

def update
  respond_to do |format|
    if @post_attachment.update(post_attachment_params)
      format.html { redirect_to @post_attachment.post, notice: 'Post attachment was successfully updated.' }
    end 
  end
end

Raylar 3'te güçlü parametreler tanımlamanıza gerek yoktur ve hem modelde hem de kabul _nested_ özniteliğinde özellik_accessible tanımlayabildiğiniz için, erişim özelliği raylarda 4 kullanımdan kaldırılmıştır.

Bir eki düzenlemek için bir seferde tüm ekleri değiştiremeyiz. bu yüzden eki birer birer değiştireceğiz veya kuralınıza göre değiştirebilirsiniz, Burada size herhangi bir eki nasıl güncelleyeceğinizi göstereceğim.

CarrierWave'in belgelerine bakarsak, bu aslında artık çok kolay.

https://github.com/carrierwaveuploader/carrierwave/blob/master/README.md#multiple-file-uploads

Resimleri eklemek istediğim model olarak Ürünü örnek olarak kullanacağım.

1. Carrierwave ana dalını edinin ve Gemfile'ınıza ekleyin:

   gem 'carrierwave', github:'carrierwaveuploader/carrierwave'
   

2. Bir dizi görüntüyü barındırmak için amaçlanan modelde bir sütun oluşturun:

   rails generate migration AddPicturesToProducts pictures:json
   

3. Taşıma işlemini çalıştırın

   bundle exec rake db:migrate
   

4. Ürün modeline resim ekle

   app/models/product.rb
   
   class Product < ActiveRecord::Base
     validates :name, presence: true
     mount_uploaders :pictures, PictureUploader
   end
   

5. ProductsController'daki güçlü parametrelere resim ekleyin

   app/controllers/products_controller.rb
   
   def product_params
     params.require(:product).permit(:name, pictures: [])
   end
   

6. Formunuzun birden fazla resmi kabul etmesine izin verin

   app/views/products/new.html.erb
   
   # notice 'html: { multipart: true }'
   <%= form_for @product, html: { multipart: true } do |f| %>
     <%= f.label :name %>
     <%= f.text_field :name %>
   
     # notice 'multiple: true'
     <%= f.label :pictures %>
     <%= f.file_field :pictures, multiple: true, accept: "image/jpeg, image/jpg, image/gif, image/png" %>
   
     <%= f.submit "Submit" %>
   <% end %>
   

7. Görünümlerinizde, resimler dizisini ayrıştıran görüntülere başvurabilirsiniz:

   @product.pictures[1].url
   

Bir klasörden birkaç görüntü seçerseniz, sıra, onları yukarıdan aşağıya doğru tam olarak aldığınız sıra olacaktır.

SSR yanıtına bazı küçük eklemeler :

accepts_nested_attributes_for , üst nesnenin denetleyicisini değiştirmenizi gerektirmez. Yani düzeltmek gerekirse

name: "post_attachments[avatar][]"

-e

name: "post[post_attachments_attributes][][avatar]"

tüm bu denetleyici değişiklikleri, bunun gibi gereksiz hale gelir:

params[:post_attachments]['avatar'].each do |a|
  @post_attachment = @post.post_attachments.create!(:avatar => a)
end

Ayrıca PostAttachment.newana nesne formuna eklemelisiniz :

Views / posts / _form.html.erb'de

  <%= f.fields_for :post_attachments, PostAttachment.new do |ff| %>
    <div class="field">
      <%= ff.label :avatar %><br>
      <%= ff.file_field :avatar, :multiple => true, name: "post[post_attachments_attributes][][avatar]" %>
    </div>
  <% end %>

Bu, ebeveynin denetleyicisindeki bu değişikliği gereksiz hale getirir:

@post_attachment = @post.post_attachments.build

Daha fazla bilgi için bkz. fields_for formunu Raylar görünmüyor, iç içe formu

Eğer Raylar 5 kullanırsanız, o zaman değiştirmek Rails.application.config.active_record.belongs_to_required_by_defaultdeğeri trueiçin false(config / ilklendiriciler / new_framework_defaults.rb) nedeniyle bir hata içine accepts_nested_attributes_for (Aksi accepts_nested_attributes_for olacak Raylar 5 altında olmayan genellikle iş).

DÜZENLEME 1:

Yok etme hakkında eklemek için :

Modellerde / post.rb

class Post < ApplicationRecord
    ...
    accepts_nested_attributes_for :post_attachments, allow_destroy: true
end

Views / posts / _form.html.erb'de

 <% f.object.post_attachments.each do |post_attachment| %>
    <% if post_attachment.id %>

      <%

      post_attachments_delete_params =
      {
      post:
        {              
          post_attachments_attributes: { id: post_attachment.id, _destroy: true }
        }
      }

      %>

      <%= link_to "Delete", post_path(f.object.id, post_attachments_delete_params), method: :patch, data: { confirm: 'Are you sure?' } %>

      <br><br>
    <% end %>
  <% end %>

Bu şekilde , bir alt nesnenin denetleyicisine sahip olmanıza gerek kalmaz ! Demek istediğim artık hiçbir şeye PostAttachmentsControllergerek yok. Üst nesnenin controller ( PostController) 'a gelince , neredeyse değiştirmiyorsunuz - orada değiştirdiğiniz tek şey, beyaz listedeki parametrelerin listesidir (alt nesne ile ilgili parametreleri dahil etmek için):

def post_params
  params.require(:post).permit(:title, :text, 
    post_attachments_attributes: ["avatar", "@original_filename", "@content_type", "@headers", "_destroy", "id"])
end

Bu yüzden bu accepts_nested_attributes_forkadar şaşırtıcı.

Ayrıca çoklu dosya yüklemesini nasıl güncelleyeceğimi buldum ve biraz da yeniden düzenledim. Bu kod benim ama sürüklenmeyi anlıyorsun.

def create
  @motherboard = Motherboard.new(motherboard_params)
  if @motherboard.save
    save_attachments if params[:motherboard_attachments]
    redirect_to @motherboard, notice: 'Motherboard was successfully created.'
  else
    render :new
  end
end


def update
  update_attachments if params[:motherboard_attachments]
  if @motherboard.update(motherboard_params)
    redirect_to @motherboard, notice: 'Motherboard was successfully updated.'
  else
   render :edit
  end
end

private
def save_attachments
  params[:motherboard_attachments]['photo'].each do |photo|
    @motherboard_attachment = @motherboard.motherboard_attachments.create!(:photo => photo)
  end
end

 def update_attachments
   @motherboard.motherboard_attachments.each(&:destroy) if @motherboard.motherboard_attachments.present?
   params[:motherboard_attachments]['photo'].each do |photo|
     @motherboard_attachment = @motherboard.motherboard_attachments.create!(:photo => photo)
   end
 end

İşte modeldeki ikinci refaktörüm:

1. Özel yöntemleri modele taşıyın.
2. @Motherboard'u self ile değiştirin.

Denetleyici:

def create
  @motherboard = Motherboard.new(motherboard_params)

  if @motherboard.save
    @motherboard.save_attachments(params) if params[:motherboard_attachments]
  redirect_to @motherboard, notice: 'Motherboard was successfully created.'
  else
    render :new
  end
end

def update
  @motherboard.update_attachments(params) if params[:motherboard_attachments]
  if @motherboard.update(motherboard_params)
    redirect_to @motherboard, notice: 'Motherboard was successfully updated.'
  else
    render :edit
  end
end

Anakart modelinde:

def save_attachments(params)
  params[:motherboard_attachments]['photo'].each do |photo|
    self.motherboard_attachments.create!(:photo => photo)
  end
end

def update_attachments(params)
  self.motherboard_attachments.each(&:destroy) if self.motherboard_attachments.present?
  params[:motherboard_attachments]['photo'].each do |photo|
    self.motherboard_attachments.create!(:photo => photo)
  end
end

İlişkilendirmeyi kullanırken, @post.post_attachmentsayarlamanıza gerek yoktur post_id.