How to validate form after AJAX submit?

Question

I have a form which I submit via AJAX so expected response format from server is javascript. The problem is I can't make validation work like this. Usually I would do it just like this:

  # POST /cats
  # POST /cats.json
  def create
    @cat = Cat.new(cat_params)

    respond_to do |format|
      if @cat.save
        format.html { redirect_to @cat, notice: 'Cat was successfully created.' }
        format.json { render action: 'show', status: :created, location: @cat }
      else
        format.html { render action: 'new' }
        format.json { render json: @cat.errors, status: :unprocessable_entity }
      end
    end
  end 

But now I have a situation like this:

  # POST /cats
  # POST /cats.json
  def create
    @cat = Cat.new(cat_params)

    respond_to do |format|
      if @cat.save
        format.js { }
      else
        format.js { ????? }
      end
    end
  end

I've created create.js.erb which does everything what's needed for me if new object is saved but I don't know how to process validation display if the object is not saved. Inside my form I have this which works if I don't use AJAX:

  <% if @cat.errors.any? %>
    <div id="error_explanation">
      <ul>
      <% @cat.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

What can I do? I am using Rails 4.

Answer 1

In your create.js.erb you can render the form again unless @cat.persisted? .

1. Take the form in another partial for example '_form.html.erb'.

2. If your form is inside a div with id "my_form_div",

then the create.js.erb will be

<%  if @cat.persisted? %>
  # code for success save
<% else %>
  $('#my_form_div').html('<%= escape_javascript(render('form')) %>');
<% end %>

This will render the whole form again along with the errors. You can do the same for only the errors div if you don't want to render the full form again.

Answer 2

You can render create.js.erb in both cases success and failure and in you create.js.erb file check whether @cat.errors.any? if so you can write some jquery and inject errors in the html if not so process with the success scenario as before.

sample code to illustrate what i mean ex:

def create
  @cat = Cat.new(cat_params)

  respond_to do |format|
   @error = @cat.save
   // or you can use if if you need more in success case to be done before rendering
   format.js {}
  end
end

in Your create.js.erb ::

<% if @error %>
  // loop over errors like your working code in the case of html request
<% else %>
  // success scenario
<% end %>