喜欢/不喜欢按钮

Question

I am trying to create like button which, allows a user to like a post. Then button transform into an unlike button which, allows a user to unlike a post. I did it, but i think it's wrong.

My code

    <div class='likes'>
       <% if user_signed_in?%>
          <% unless current_user.likes?(post) %>
             <%= link_to image_tag('unlike.png', alt: 'unlike'), like_path(post) %>
          <% else %>
             <%= link_to image_tag('like.png', alt: 'like'), unlike_path(post) %>
          <% end %>
          <% if post.likers_count >0 %>
             <%= post.likers_count %>
          <% end %>
       <% end %>
    </div>

When I click on like button whole page is reloaded, but i need only reload a button. How I can do it?

Answer 1

Do this:

#config/routes.rb
resources :posts do
   match :vote, on: :member, via: [:post, :delete]
end

#app/controllers/posts_controller.rb
class PostsController < ApplicationController
   def vote
      @post = Post.find params[:id]
      if request.post?
         ... vote up
      elsif request.delete?
         ... vote down
      end
      respond_to do |format|
         format.js #-> only XHR allowed
      end
   end
end

#app/views/posts/vote.js.erb
$(".likes").html("<%=j render 'posts/vote' %>");

#app/views/posts/_vote.html.erb
<% if user_signed_in?%>
    <% method = current_user.likes?(@post) ? ["post", ""] : ["delete", "un"] %>
    <%= link_to image_tag("#{method[1]}like.png", alt: "#{method[1]}like"), post_vote_path(@post), method: method[0].to_sym, remote: true %>
    <%= @post.likers_count if @post.likers_count > 0 %>
<% end %>

In your posts#show view, you should do this:

#app/views/posts/show.html.erb
<div class="likes">
   <%= render partial: "vote" %>
</div>