Can't save image with paperclip

Question

I'm using paperclip to drag and drop image with dropzone. And i have a problem to insert image into database. So, please help me to fix that. This is my error when i check log file:

Processing by UploadsController#create as JSON
  Parameters: {"utf8"=>"✓", "authenticity_token"=>"iuwYSudAJbAJMuJ2CLLdNhHF1o3pS1uxfwE+T7Li1mw=", "upload"=>{"image"=>#<ActionDispatch::Http::UploadedFile:0x3350fe8 @original_filename="Koala.jpg", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"upload[image]\"; filename=\"Koala.jpg\"\r\nContent-Type: image/jpeg\r\n", @tempfile=#<File:C:/Users/QUANGD~1/AppData/Local/Temp/RackMultipart20141110-4904-1ecpi5y>>}}
  [1m[35m (1.0ms)[0m  begin transaction
  [1m[36m (0.0ms)[0m  [1mrollback transaction[0m
image: /images/original/missing.png
  [1m[35m (0.0ms)[0m  begin transaction
  [1m[36m (0.0ms)[0m  [1mrollback transaction[0m
Completed 400 Bad Request in 28.0ms (Views: 0.0ms | ActiveRecord: 1.0ms)

I dont know what missing.pmg is.

This is my upload model

class Upload < ActiveRecord::Base
  attr_accessible :image
  has_attached_file :image, :styles => { :medium => "300x300>",:thumb => "100x100>" }

  validates_attachment  :image, 
        :presence => true,
        :content_type => { :content_type => /\Aimage\/.*\Z/ },
        :size => { :less_than => 1.megabyte }
end

My upload controller

class UploadsController < ApplicationController
  def new
    @upload = Upload.new
  end

  def create
    @upload = Upload.create(:image => params[:image])
    logger.debug "image: #{@upload.image}"
    if @upload.save
      render json: { message: "success" }, :status => 200
    else
      render json: { error: @upload.errors.full_messages.join(',')}, :status => 400
    end
  end
end

My upload html

<script>
    $(document).ready(function(){
    // disable auto discover
    Dropzone.autoDiscover = false;

    // grap our upload form by its id
    $("#new_upload").dropzone({
        // restrict image size to a maximum 1MB
        maxFilesize: 1,
        // changed the passed param to one accepted by
        // our rails app
        paramName: "upload[image]",
        // show remove links on each image upload
        addRemoveLinks: true
    }); 
});
</script>
<div class="medium-4 medium-centered row">
    <div class="medium-10 medium-centered columns">
        <%= form_for(@upload, html: { multipart: true, class: "dropzone"}) do |f|  %>
        <div class="fallback">
            <%= f.file_field :image %>
            <br>
            <%= f.submit "Upload" %>
        </div>
        <% end %>
    </div>
</div>

Answer 1

Look at your log:

Parameters: {"upload"=>{"image"=>#<ActionDispatch::Http::UploadedFile:0x3350fe8 @original_filename="Koala.jpg", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"upload[image]\"; filename=\"Koala.jpg\"\r\nContent-Type: image/jpeg\r\n", @tempfile=#<File:C:/Users/QUANGD~1/AppData/Local/Temp/RackMultipart20141110-4904-1ecpi5y>>}}

And in script in html:

# .....   
paramName: "upload[image]"
# ..... 

So i think you should fix create action:

# ..... 
@upload = Upload.create(:image => params[:upload][:image])
# .....