Question

I have a nav menu with 2 tabs/links in the show.html.erb file, in UsersController.rb, I would like to use ajax to render different partial for the tabs.

In the show.html.erb I have a div named profile-data where I want to show the content.
So I do something like this:

The link structure:

<li><%= link_to "College friends", college_friends_path, :remote => true %></li>
<li><%= link_to "Highschool friends", highschool_friends_path, :remote => true %></li>

I define the routes:

match "college_friends" => "users#college_friends", :as => "college_friends"
match "highschool_friends" => "users#highschool_friends, :as => "highschool_friends"

And I define in my UserController.rb the necessary methods:

class UsersController < ApplicationController
  def show
    @user = User.find(params[:id])
  end

  def college_friends
    respond_to do |format|
      format.js
    end
  end

  def highschool_friends
    respond_to do |format|
      format.js
    end
  end
end

Last thing we have the JS files:

*college_friends.js.erb*

$('#profile-data').html("<%= escape_javascript(render(:partial => 'college_friends')) %>");

*highschool_friends.js.erb*

$('#profile-data').html("<%= escape_javascript(render(:partial => 'highschool_friends')) %>");

The partial code: _college_friends.html.erb

<% groups = @user.friends.group_by(&:college_name) %>
<% sorted_groups = groups.sort_by{|key, values| values.count}.reverse %>
<% sorted_groups.each do |collegename, friends| %>
<% next if collegename.blank? %>
<div class="contentbox">
    <div class="box-header">
        <h3><%= collegename %></h3>
        <div class="meta-info">
            <p><i class="icon-map-marker"></i> Malmö</p>
            <p><i class="icon-user"></i><span class="count"> <%= friends.count %></span> vänner</p>
        </div>
    </div>
    <ul class="friends-list">
        <% friends.map do |friend| %>
        <li><%= image_tag(friend.image) %>
            <% end %> 
        </ul> 
    </div>
<% end %>

Nothing happens when I click the the links, and get this error in the console:

Started GET "/universitet_friends" for 127.0.0.1 at 2012-07-29 01:53:39 +0200
Processing by UsersController#universitet_friends as JS
  Rendered users/_universitet_friends.html.erb (1.6ms)
  Rendered users/universitet_friends.js.erb (3.1ms)
Completed 500 Internal Server Error in 7ms

ActionView::Template::Error (undefined method `friends' for nil:NilClass):
    1: <% groups = @user.friends.group_by(&:college_name) %>
    2: <% sorted_groups = groups.sort_by{|key, values| values.count}.reverse %>
    3: <% sorted_groups.each do |collegename, friends| %>
    4: <% next if collegename.blank? %>
  app/views/users/_universitet_friends.html.erb:1:in `_app_views_users__universitet_friends_html_erb___1983680250475155079_70236040373720'
  app/views/users/universitet_friends.js.erb:1:in `_app_views_users_universitet_friends_js_erb__1317362850668628869_70236044930260'
  app/controllers/users_controller.rb:19:in `universitet_friends

Any help would be appreciated.

Answer 1

ActionView::Template::Error (undefined method `friends’ for
nil:NilClass):

This is telling you that your @user variable is nil. This happened because when you went back to your controller for the AJAX request, you never actually set the @user variable. It does not persist between requests. You need to pass that variable during the ajax request. One way to do it is to add a user_id param to the ajax URL.