CODEWITHSUNDEEP
jqueryruby-on-railsruby-on-rails-4jquery-file-uploadjquery-fileupload-rails
hellomello
hellomello

Reputation: 8597

jQuery File Upload - Error when uploading. Missing params

Getting an error with jQuery upload

ActionController::ParameterMissing - param is missing or the value is empty: project:

I've added a new add_photos.html.erb page because I want to add photos after someone submits a project in form, thats why in the controller below, after create, it redirects to add photos.

Here is my add_photos.html.erb

<%= simple_form_for @project, html: { multipart: true, id: 'fileupload' } do |f| %>
  <input type="file" name="photos[]" id='photo_upload_btn', multiple>
<% end %>

<script>
$(function () {

    'use strict';

    $('#fileupload').fileupload({
    });

    $('#fileupload').addClass('fileupload-processing');
    $.ajax({
        url: $('#fileupload').fileupload('option', 'url'),
        dataType: 'json',
        context: $('#fileupload')[0]
    }).always(function () {
        $(this).removeClass('fileupload-processing');
    }).done(function (result) {
        $(this).fileupload('option', 'done')
            .call(this, $.Event('done'), {result: result});
    });
});
</script>

My Controller

def add_photos
  @project = current_user.projects.find(params[:id])
end

def create
  @project = Project.new(project_params)

  respond_to do |format|
    if @project.save

      if params[:photos]
        params[:photos].each { |image|
          @project.project_images.create(photo: image)
        }
      end
      format.html { redirect_to add_photos_project_path(@project), notice: 'Project was successfully created.' }
      format.json { render :show, status: :created, location: @project }
    else
      format.html { render :new }
      format.json { render json: @project.errors, status: :unprocessable_entity }
    end
  end
end

My routes

resources :projects do
  member do
    get 'add-photos'
    post 'upload_photos'
  end
end

Upvotes: 0

Views: 376

Answers (1)

Tim Kretschmer
Tim Kretschmer

Reputation: 2280

try adding

processData: false,
contentType: false,

to the ajax request. i had the same problem and it was getting a mess.

$.ajax({
    url: $('#fileupload').fileupload('option', 'url'),
    dataType: 'json',
    processData: false,
    contentType: false,
    context: $('#fileupload')[0]
}).always(function() {
    $(this).removeClass('fileupload-processing');
}).done(function(result) {
    $(this).fileupload('option', 'done')
        .call(this, $.Event('done'), {
            result: result
        });
});

and just saying: with your form, params[:project] always will be empty. its just an empty form. in general i would advise you to go nested_form. tell your project that it accepts nested_attributes_for :project_images and then its params[:project][:photos]

Upvotes: 0

Related Questions