Jason Shultz
Jason Shultz

Reputation: 970

I'm receiving a 406 error on ajax return

I'm new to rails so I'm probably messing this up somehow (obviously). I have a form that is sending the submission back to the controller via ajax. The data is getting there and getting into the db. The goal is that on successful submission the data will be returned in an html format that I can then prepend to page without causing a page refresh.

Here's my controller:

# POST /projects
# POST /projects.json
  def create
   @project = Project.new(params[:project])
   @project.user_id = current_user.id

    respond_to do |format|
      if @project.save
        #format.html { redirect_to @project, notice: 'Project was successfully created.' }
        #format.json { render json: @project, status: :created, location: @project }
        render :partial => "projects/project", :locals => { :project => @project }
    else
       format.html { render action: "new" }
       format.json { render json: @project.errors, status: :unprocessable_entity }
    end
  end
end

My ajax function looks like this:

$('#new_project').submit(function(){

    $.ajax({
        type: 'post',
        beforeSend: setHeader,
        url:'/projects',
        dataType: 'json',
        data: $('#new_project').serialize(),
        success: function(json) {
            console.log(json);
            parent.jQuery('#cboxClose').click();
        }
    });

    return false;

});

And finally, my partial. The partial is part of a loop. The loop works great and there's no problem there. The loop looks like this:

  <% @projects.each do |project| %>

      <%= render :partial => "project", :object  => project %>

  <% end %>

And the partial looks like this:

<section class="project">

  <p class="name"><span>Name: </span> <%= project.name %></p>
  <p class="title"><span>Title: </span><%= project.title %></p>
  <p class="title"><span>User ID: </span><%= project.user_id %></p>
  <article>
    <span>Details:</span> <%= project.details %>
  </article>
  <article>
    <p>Meta:</p>
    <%= link_to 'Show', project %>
    <%= link_to 'Edit', edit_project_path(project), :data => { :colorbox => true,:colorbox_height => '500px', :colorbox_width => '500px', :colorbox_iframe => true } %>
    <%= link_to 'Destroy', project, method: :delete, data: { confirm: 'Are you sure?' } %>
  </article>

</section>

So that's it. I thought I was on the right track but the 406 error is throwing me for a loop.

Upvotes: 2

Views: 413

Answers (1)

Parandroid
Parandroid

Reputation: 513

You send ajax request and your application should return javascript (or json) back to browser. But you call "render" and response has html type. So 406 error is.

If you want to render partial after success ajax call you should slightly change your controller (consider using format.js against format.json).

Controller:

if @project.save
   format.html { redirect_to @project, notice: 'Project was successfully created.' }
   format.js  #render create.js.erb
else
   format.html { render action: "new" }
   format.json { render json: @project.errors, status: :unprocessable_entity }
end

And you should create file create.js.erb in directory with views of this controller with something like that:

$("div#that_you_wat_to_update").html("<%= escape_javascript render(:partial => 'projects/project', :locals => { :project => @project }) %>");

P.S. If you really want to respond with json, than you should update your ajax call to process the json response, but it's another story.

Upvotes: 3

Related Questions