[RUBY] Multiple image upload function using Rails Carrierwave

It is described as a memorandum.

Introducing a gem called Carrierwave

carrierwaveuploader/carrierwave

Describe the following in the Gemfile

gem "carrierwave", "~> 2.0"

When finished, at the terminal bi

bundle install

Creating an Uploader

bundle exec rails g uploader Images

The following is created.

images_uploader.rb

I can play around with the settings of the uploaded file, but this time I will not.

MVC settings

Image registration is possible with a model called Memory for the Post model.

Model

Post

post.rb

class Post < ApplicationRecord
  has_many :memories
  accepts_nested_attributes_for :memories, allow_destroy: true
  validates :title, presence: true
end

The accepts_nested_attributes_for: memories setting allows you to register memories on posts_controller.

Memory

memory.rb

class Memory < ApplicationRecord
  belongs_to :post
  mount_uploader :image, ImagesUploader
end

mount_uploader is the carrierwave setting. Now you can easily upload.

Controller

posts_controller.rb

posts_controller.rb

class PostsController < ApplicationController
  

  def new
    @post = Post.new
		# @post.memories.The build is ready to save the memories associated with the post
    @post_memory = @post.memories.build
  end

  def create
    post = Post.new(post_params)
    if post.save!
		#The following is the process to save in memories. Multiple images can be saved with each statement.
      params[:memories][:image].each do |image|
        post.memories.create(image: image, post_id: post.id)
      end
    end
    redirect_to root_path
  end

  private

    def post_params
      params.require(:post).permit(:title, memories_attributes: [:image]).merge(user_id: current_user.id)
    end
end

View

new.html.erb

<%= form_for @post, local: true,  html: {class: "form_area"} do |f| %>
        <div class="form_area__field">
          <%= f.text_area :title, id: "post_text", placeholder: "Enter the posted content", rows: 10%>

          <div class="form_area__image_field">
            <%= f.fields_for :memories do |m| %>
              <%= m.label :image, "image" %>
              <%= m.file_field :image, multiple: true, name: "memories[image][]" %>
              <%= hidden_field :memories, :post_id, value: @post.id %>
            <% end %>
          </div>

          <div class="form_area__hidden_field">
            <%= hidden_field :post, :user_id, value: current_user.id %>
          </div>

          <div class="form_area__action">
            <%= f.submit "Post", class: "form_area__action__btn" %>
          </div>

        </div>
      <% end %>

You can save multiple classes in one post with fields_for.

multiple: true is set to allow multiple images to be posted.

How to display?

<% @post.memories.each do |m|%>
     <%= image_tag m.image.url %>
<% end %>

Can be displayed above.

How to add an image? (Added on January 16, 2021)

Implemented the function to add an image to an article that has already been posted with an image. The result is very simple, but I had a hard time not knowing how to implement it.

function

--If the content of the article is changed, only the article will be changed --Otherwise the image will be added

Controller

def update

    post = Post.find(params[:id])
    #Comparing the article before the update with the article passed as params
    if post.title != params[:post][:title]

      post.update!(post_params)

    else
      post.save!

      params[:memories][:image].each do |image|
        post.memories.create(image: image, post_id: post.id)
      end
    end

    redirect_to root_path
  end

I think it would be better if I could edit the selected image, but this feature is coming again. .. ..