Missing template error when using Ajax to load data on Rails

Question

I'm trying to load the saved data using AJAX, to avoid refreshing the whole web page. I've been watching the rails cast Jquery Ajax video episode 136.

The problem occurs when I save the data on the rendered form. When I click save button nothing happens, but making a debug on chrome developer tool, I found the error ActionView::MissingTemplate in Locations#create. Locations is my model, and create the action to create.

I've Spent a lot of hours trying to find out what's wrong, and watching again and again the rail casts without any result. Please if someone could help.

This is the controller file locations_controller.rb

class LocationsController < ApplicationController

  def index
    @locations = Location.all
    @json = Location.all.to_gmaps4rails 
  end 

  def new
    @location = Location.new
  end

  def edit
    @location = Location.find(params[:id])
  end

  def create
    @location = Location.new(params[:location])
     respond_to do |format|
        format.html { redirect_to @location, notice: 'Location was successfully created.' }
        format.js   
    end
  end

def show
    @location = Location.find(params[:id])
    respond_to do |format|
      format.html # show.html.erb
      format.json { render json: @location }
    end
  end
  def update
    @location = Location.find(params[:id])

    respond_to do |format|
      if @location.update_attributes(params[:location])
        format.html { redirect_to @location, notice: 'Location was successfully updated.' }
        format.json { head :no_content }
      else
        format.html { render action: "edit" }
        format.json { render json: @location.errors, status: :unprocessable_entity }
      end
    end
  end

  def destroy
    @location = Location.find(params[:id])
    @location.destroy

    respond_to do |format|
      format.html { redirect_to locations_url }
      format.json { head :no_content }
    end
  end
end

This is the model file location.rb

class Location < ActiveRecord::Base
  attr_accessible :address, :gmaps, :latitude, :longitude, :name
  validates_presence_of :name, :address

  acts_as_gmappable :check_process => false


  def gmaps4rails_address
    address
  end

   def gmaps4rails_infowindow  
  "<h1>#{self.name}</h1>"
  end

  def gmaps4rails_sidebar
   "<h4>#{name}</h4>" 
  end
end

The new.js.erb file

$('#new_link').hide().after('<%= j render("form") %>');

The create.js.erb file

$('#new_location').remove();
$('#new_link').show();
$('#allsites').empty().append('<%= j render(@location) %>'); 

The index.html.erb

<%= gmaps("markers" => {"data" => @json}) %>  


<table>
  <tr>
    <th>Name</th>
    <th>Address</th>
    <th></th>
    <th></th>
    <th></th>
  </tr>

<% @locations.each do |location| %>
  <tr>
    <td><%= location.name %></td>
    <td><%= location.address %></td>
    <td><%= link_to 'Show', location %></td>
    <td><%= link_to 'Edit', edit_location_path(location) %></td>
    <td><%= link_to 'Destroy', location, method: :delete, data: { confirm: 'Are you sure?' } %></td>
  </tr>
<% end %>
</table>
<div id="allsites">
//here I want to load all the data, ignore the table above
  </div>


<%= link_to 'New Location', new_location_path, id:"new_link", remote: true%>

<br />

Also the :remote => true has been added to the form

Partial _form.html.erb file

<%= form_for(@location, :remote => true) do |f| %>
  <% if @location.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@location.errors.count, "error") %> prohibited this location from being saved:</h2>

      <ul>
      <% @location.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= f.label :name %><br />
    <%= f.text_field :name %>
  </div>
  <div class="field">
    <%= f.label :address %><br />
    <%= f.text_field :address %>
  </div>
  <div class="field">
    <%= f.label :latitude %><br />
    <%= f.text_field :latitude %>
  </div>
  <div class="field">
    <%= f.label :longitude %><br />
    <%= f.text_field :longitude %>
  </div>
  <div class="field">
    <%= f.label :gmaps %><br />
    <%= f.check_box :gmaps %>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

Working on Rails 3.2.13 This is my source http://railscasts.com/episodes/136-jquery-ajax-revised

Any help or sugestion will be apretiated, have a nice day everybody

EDIT: I'm sorry I forgot the screenshots

Answer 1

In your create action, you are not saving the object. All you are doing is making a call to new. You probably want to save it using @location.save after the call to new or use the create method instead:

@location = Location.create(params[:location])

Then your redirect_to @location goes to your show action which also needs a show.html.erb which you do not seem to have and that is probably the reason why you are getting the MissingTemplate error.

Oh, saw your screenshot, you don't have location partial defined as shown in your second screenshot. Since you're passing @location it's looking for _location.html.erb Please add that partial and use location to use your location's attributes instead of @location. Please report back if it still gives you problem.