Как сделать так, чтобы счетчик лайков падал, когда я нажимал кнопку неприязни, и наоборот?

Question

Это контроллер с подобным действием:

 def like
like = Like.create(like: params[:like], user: current_user, story: @story)

respond_to do|format|
  if like.valid?
    format.js
  else
    format.js {render status: 403, js: "alert('You can only like/dislike a story once')"}
  end
end

это модель, которая имеет счетчик из модели:

   def thumbs_up_total
       self.likes.where(like: true).size
   end

   def thumbs_down_total
       self.likes.where(like: false).size
   end

это вид. Я получаю счетчик от модели. "большие пальцы вверх" и "большие пальцы вниз":

          <div class="pull-right">
              <%= link_to like_story_path(story, like: true), method: :post, data: { remote: true } do %>
              <div class="likes"></div>
              <% end %>
              <div id = "like-<%= story.id %>">
              <%= story.thumbs_up_total %>
              </div>
              <%= link_to like_story_path(story, like: false), method: :post, data: { remote: true } do %>
              <div class="dislikes"></div>
              <% end %>
              <div id="dislike-<%= story.id %>">
              <%= story.thumbs_down_total %>
              </div>
           </div>

Answer 1

Я полагаю, вы просите что-то вроде этого, правильно?

<div class="pull-right">
              <%= link_to like_story_path(story, like: true), method: :post, data: { remote: true } do %>
              <div class="likes"></div>
              <% end %>
              <div id = "like-<%= story.id %>">
              <%= story.thumbs_up_total - story.thumbs_down_total%>
              </div>
              <%= link_to like_story_path(story, like: false), method: :post, data: { remote: true } do %>
              <div class="dislikes"></div>
              <% end %>
              <div id="dislike-<%= story.id %>">
              <%= story.thumbs_down_total - story.thumbs_up_total %>
              </div>
           </div>

Answer 2

Переместить части вашего представления в частичные, создатьlike.js и заполните его кодом для рендеринга частей.

Сначала измените свой код вида на этот

      <div class="pull-right">
          <%= link_to like_story_path(story, like: true), method: :post, data: { remote: true } do %>
          <div class="likes"></div>
          <% end %>
          <%= render "thumbs_up" %>
          <%= link_to like_story_path(story, like: false), method: :post, data: { remote: true } do %>
          <div class="dislikes"></div>
          <% end %>
          <%= render "thumbs_down" %>>
       </div>

Затем создайте две новые частичные.

# _thumbs_up.html..erb
<div id = "like-<%= story.id %>" class="thumbs-up">
     <%= story.thumbs_up_total %>
 </div>

# _thumbs_down.html..erb
<div id = "like-<%= story.id %>" class="thumbs-down">
     <%= story.thumbs_down_total %>
 </div>

Добавить файл с именем like.js

# like.js
$(".thumbs-up").html("<%= j(render("thumbs_up")) %>");
$(".thumbs-down").html("<%= j(render("thumbs_down")) %>");

Like.js будет вызываться при нажатии на ваши ссылки. Он будет повторно визуализировать ваши частичные и обновит счетчики большого пальца при клике.