Question

The left column div is a list of lists. I'm trying to use AJAX to add a new list. I'm following the screencast http://railscasts.com/episodes/136-jquery-ajax-revised but I am getting an error. It seems to be a problem with the create action. Please note that when I refresh the page, the new list appears so it is getting created and added to the database.

Here is the 500 internal server error I get (from lists file using POST in Network tab) when I try submitting the name of the new list:

ActionView::MissingTemplate in Lists#create

Showing /Users/jeff/Documents/rails_projects/grocery-beta/app/views/lists/create.js.erb where line #3 raised:

Missing partial lists/list with {:locale=>[:en], :formats=>[:js, :html], :handlers=>[:erb, :builder, :coffee]}. Searched in:  * "/Users/jeff/Documents/rails_projects/grocery-beta/app/views"  * "/usr/local/rvm/gems/ruby-1.9.3-p194/gems/devise-2.2.3/app/views"

Extracted source (around line #3):

1: $('#new_list').remove();2: $('#new_link').show();3: $('#lists').append('<%= j render(@list) %>');

app/views/lists/create.js.erb:3:in `_app_views_lists_create_js_erb__870295634789681698_70311054285220'app/controllers/lists_controller.rb:36:in `create'

Here is my create.js.erb file:

$('#new_list').remove();
$('#new_link').show();
$('#lists').append('<%= j render(@list) %>');

Here is the create action from mylists_controller.rb file:

def create
    @list = List.create!(params[:list])
    respond_to do |format|
      format.html { redirect_to root_url }
      format.js
    end
  end

Here is my root page, home.html.erb:

<div id="main-left">
    <div id="main-left-1">
        <%= link_to 'Add List', new_list_path, class: "button", id: "new_link", remote: true %>
    </div>
    <ul id="lists" data-update-url="<%= sort_lists_url %>">
      <% @lists.each do |list| %>
        <%= content_tag_for :li, list do %>
          <%= link_to list.name, list, :remote => true, :class => "link" %>
        <% end %>
      <% end %>
    </ul>
</div>

Here is my _form.html.erb parial file:

<%= form_for @list, remote: true do |f| %>

  <% if @list.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@list.errors.count, "error") %> prohibited this list from being saved:</h2>

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

  <div class="field">
    <%= f.text_field :name %>
  </div>
<% end %>

Here is my application.html.erb file:

<!DOCTYPE html>
<html>
    <head>
        <title>
            Grocery List
        </title>
        <%= stylesheet_link_tag "application", :media => "all" %>
        <%= javascript_include_tag "application" %>
        <%= csrf_meta_tags %>
        <link href='http://fonts.googleapis.com/css?family=Noto+Serif|Gabriela' rel='stylesheet' type='text/css'>
    </head>
    <body>
      <div id="wrapper">
        <%= render 'layouts/header' %>
        <div id="main">
            <%= yield %>
        </div><!-- main -->
      </div><!-- wrapper -->
  </body>
</html>

Here is my new.js.erb file:

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

Solution

Seems a problem in render(@list). Rails can't find appropriate template to render.

Suggested revise:

In create.js.erb

# The task is to rendering a piece of "list" and add it to exist "lists"
# Suppose the template of this piece is "list/_piece.html.erb"
# It's necessary to pass `@list` variable so that it knows which one to show
$('#lists').append('<%= j render(partial: 'piece', locals: {list: @list}) %>');

Then in _piece.html.erb, use a local variable list but not @list To read:

<li><%= list.name %></li>

Then your code should be able to work.

Side note: The "piece" template could also be called in the index template, or the sidebar list of list, so it will be DRY.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top