CODEWITHSUNDEEP
jqueryruby-on-railsrubyajaxruby-on-rails-4
Alex Heil
Alex Heil

Reputation: 345

Render local variables in partials with Ajax, Rails 4

I'm having trouble getting my local variables to display inside the partials after the Ajax call. Here is my setup:

View - index.html.erb

<% @artists.each do |artist| %>
  <div class="index_follow_button">
    <%= render "partials/index_follow_button", :artist => artist %>
  </div>
<% end %>

View partials/_index_follow_button.html.erb

<% if fan_signed_in? %>
  <% if fan_signed_in? && current_fan.following_artist?(artist) %>
    <%= button_to "unfollow", artist_relationship_path(artist, current_fan.artist_relationship_id(artist)), method: :delete, remote: true %>
  <% elsif fan_signed_in? %>
    <%= form_for(ArtistRelationship.new, url: artist_relationships_path(artist), remote: true) do |f| %>
      <%= f.submit "follow" %>
    <% end %>
  <% end %>
<% end %>

View - follow_button.js.erb

$('.index_follow_button').html('<%=  escape_javascript(render :partial => 'partials/index_follow_button.html.erb', :locals => {:artist => artist}) %>');

I believe this is where the error is

Controller - relationships_controller.rb

def create
  @relationship = ArtistRelationship.new
  @relationship.fan_id = current_fan.id
  @relationship.artist_id = Artist.friendly.find(params[:artist_id]).id
  @artist = Artist.friendly.find(params[:artist_id])
  if @relationship.save
    respond_to do |format|
      format.html { redirect_to (:back) }
      format.js { render :action => "follow_button" }
    end
  else
    redirect_to root_url
  end
end

def destroy
  current_fan.unfollow_artist(Artist.friendly.find(params[:artist_id]))
  @artist = Artist.friendly.find(params[:artist_id])
  respond_to do |format|
    format.html { redirect_to (:back) }
    format.js { render :action => "follow_button" }
  end
end

In the index page, the partial displays perfectly fine using :artist => artist, but the same thing is not happening in the JavaScript page, but I keep getting the same error - 

ActionView::Template::Error (undefined local variable or method `artist' for #<#<Class:0x3798df8>:0x6f43968>)

Any ideas?

Upvotes: 0

Views: 3303

Answers (2)

tgf
tgf

Reputation: 3266

Artist is a local variable but in your js file it's unset (unless you left some code out). Instead try to use the instance variable: follow_button.js.erb:

$('.index_follow_button').html('<%=  escape_javascript(render :partial => 'partials/index_follow_button.html.erb', :locals => {:artist => @artist}) %>');

In your index.html.erb your loop sets the local variable artist.

Looks like you also need a unique way for jquery to address the element in question. 

<% @artists.each do |artist| %>
  <div class="index_follow_button" id="artist-<%= artist.id %>">
    <%= render "partials/index_follow_button", :artist => artist %>
  </div>
<% end %>

Then once again change follow_button.js.erb; this time to use the new id as the css locator instead of the class.

$('#artist-<%= @artist.id %>').html('<%=  escape_javascript(render 
  :partial => 'partials/index_follow_button.html.erb', 
  :locals => {:artist => artist}) %>'
);

Upvotes: 3

Saiqul Haq
Saiqul Haq

Reputation: 2397

I think you missed @artist variable in your follow_button.js.erb file.

$('.index_follow_button').html('<%= escape_javascript(render :partial => 'partials/index_follow_button.html.erb', :locals => {:artist => @artist}) %>');

Upvotes: 0

Related Questions