Like button does not update with AJAX

Question

I am passing a collection (@feed_items) to a _feed_item partial via the :collection option and converting it to dailypost with :as => :dailypost.

Inside the _feed_item partial I rendered another partial for _like_button, and i used :locals to continue using dailypost.

Everything works fine with the database. Likes get added and taken out :) BUT

I am trying to use (AJAX) to create.js.erb & destroy.js.erb the like button. For some reason only the top post gets updated correctly and i have to refresh the page to see the ones below it.

I know the solution involves assigning a unique post id to each "like" element, say "like-123", but that is where i am stuck.......

I also know that the problem may be in _feed_items.html.erb because i am passing two ids....any suggestions??

Views

_feed.html.erb

<% if @feed_items.any? %>
  <ol>
    <%= render partial: 'shared/feed_item', collection: @feed_items, :as => :dailypost %>
  </ol>
<% end %>

_feed_items.html.erb

<li id="<%= @dailypost.id %>">

  <span class="user">
    <%= link_to dailypost.user.name, dailypost.user %>
  <span class="content"><%= dailypost.content_html %></span>

  <div id="like">
    <%= render :partial => 'likes/like_button', :locals =>{:dailypost => dailypost} %>
  </div>

</li>

_like_button.html.erb

<% if like = current_user.likes.find_by_dailypost_id(dailypost.id) %>
 <%= form_for like, :html => { :method => :delete }, :remote => true do |f| %>
   <%= f.submit "Unlike" %>
 <% end %>
<% else %>
 <%= form_for current_user.likes.build, :remote => true do |f| %>
  <div><%= f.hidden_field :dailypost_id, value: dailypost.id %></div>
  <%= f.hidden_field :user_id %>
  <%= f.submit "Like" %>
 <% end %>
<% end %>

create.js.erb

$("#like").html("<%= escape_javascript(render :partial => 'like_button', :locals => {:dailypost => @dailypost}) %>");

destroy.js.erb

$("#like").html("<%= escape_javascript(render :partial => 'like_button', :locals => {:dailypost => @dailypost}) %>");

Controller

class LikesController < ApplicationController


  respond_to :html, :js

  def create
    @like = Like.create(params[:like])
    @dailypost = @like.dailypost
    respond_to do |format|
      format.js
      format.html { redirect_to :back }
    end
  end

  def destroy
    like = Like.find(params[:id]).destroy
    @dailypost = like.dailypost
    respond_to do |format|
      format.js
      format.html { redirect_to :back }
    end
  end

end

Answer 1

Hmmm.Replace the first-line in _feed_items.html.erb with this.

<li id="dailypost<%= dailypost.id %>">

and In create.js.erb and destroy.js.erb, make changes

$("#like").html(...)

To

$("#dailypost<%= dailypost.id%> #like").html(...)

This should Work.