ajaxでgoodとbadでの評価機能を実装したい。

railsを勉強しながら
いいね機能を改良して、goodとbadで回答が評価できる機能を作っています。

発生している問題・エラーメッセージ

goodボタン、badボタンは正常に作動するとこまでは、できました。
そこで、

goodが存在するときに、badをおすと、badを+1、goodを-1
badが存在するときに、goodをおすと、goodを+1、badを-1

する処理をajaxを使って作りたいのですが、
goodまたはbadを-1するときの更新が自動で行われずに困っています。

実装するのにjqueryを使っているのですが、
勉強不足でどこから手を付けていいのかがわからないので、
皆様のお知恵を貸していただけたら嬉しいです。

該当のソースコード

app/views/answers/show.html.erb

<h2><%= @community.name %></h2>
<h1><%= @que.title %></h1>
<h2><%= @que.content %></h2>
<h1><%= @answer.title %></h1>

<% if user_signed_in? %>
<%#= good %>
  <div class="good-<%= @answer.id %>">
    <%= render partial: 'goods/good', locals: { answer: @answer } %>
  </div>

<%#= bad %>
  <div class="bad-<%= @answer.id %>">
    <%= render partial: 'bads/bad', locals: { answer: @answer }  %>
  </div>

<% end %>

<h2><%= @answer.content %></h2>

app/controllers/goods_controller.rb

class
1  def create
2    @answer= Answer.find_by(id: params[:answer_id])
3    @good= Good.new(
4      user_id: current_user.id,
5      community_id: params[:community_id],
6      answer_id: params[:answer_id]
7    )
8
9    if @bad= Bad.find_by(user_id: current_user.id, answer_id: params[:answer_id])
10      @bad.destroy
11    end
12    @good.save
13
14    @good_count= Good.where(answer_id: @answer.id).count
15
16    @community= Community.find_by(id: params[:community_id])
17    @que= Que.find_by(id: params[:que_id])
18    @answer= Answer.find_by(id: params[:answer_id])
19  end
20
21  def destroy
22    @answer= Answer.find_by(id: params[:answer_id])
23    @good= Good.find_by(
24      user_id: current_user.id,
25      answer_id: params[:answer_id]
26    )
27    @good.destroy
28
29    @good_count= Good.where(answer_id: @answer.id).count
30
31    @community= Community.find_by(id: params[:community_id])
32    @que= Que.find_by(id: params[:que_id])
33    @answer= Answer.find_by(id: params[:answer_id])
34  end
35end

app/controllers/bads_controller.rb

class BadsController < ApplicationController
  def create
    @answer= Answer.find_by(id: params[:answer_id])
    @bad= Bad.new(
      user_id: current_user.id,
      community_id: params[:community_id],
      answer_id: params[:answer_id]
    )

    if @good= Good.find_by(user_id: current_user.id, answer_id: params[:answer_id])
      @good.destroy
    end
    @bad.save

    @bad_count= Bad.where(answer_id: @answer.id).count

    @community= Community.find_by(id: params[:community_id])
    @que= Que.find_by(id: params[:que_id])
    @answer= Answer.find_by(id: params[:answer_id])
  end


  def destroy
    @answer= Answer.find_by(id: params[:answer_id])
    @bad= Bad.find_by(
      user_id: current_user.id,
      answer_id: params[:answer_id]
    )
    @bad.destroy

    @bad_count= Bad.where(answer_id: @answer.id).count

    @community= Community.find_by(id: params[:community_id])
    @que= Que.find_by(id: params[:que_id])
    @answer= Answer.find_by(id: params[:answer_id])
  end
end

app/views/goods/_good.html.erb

<% if Good.find_by(user_id: current_user.id, answer_id: @answer.id) %>
  <%= link_to "/communities/#{@community.id}/ques/#{@que.id}/answers/#{@answer.id}/goods", method: "delete", remote: true do  %>
    <p>good解除</p>
    <%#= image_tag 'good_1.svg' %>
  <% end %>
  <span><%= @good_count %></span>
<% else %>
  <%= link_to "/communities/#{@community.id}/ques/#{@que.id}/answers/#{@answer.id}/goods", method: "post", remote: true do %>
    <p>goodする？</p>
    <%#= image_tag 'good_0.svg' %>
  <% end %>
  <span><%= @good_count %></span>
<% end %>

app/views/goods/create.js.erb

$(".good-<%= @answer.id %>").html("<%= j(render partial: 'good') %>");

app/views/goods/destroy.js.erb

$(".good-<%= @answer.id %>").html("<%= j(render partial: 'good') %>");

app/views/bads/_bad.html.erb

<% if Bad.find_by(user_id: current_user.id, answer_id: @answer.id) %>
  <%= link_to "/communities/#{@community.id}/ques/#{@que.id}/answers/#{@answer.id}/bads", method: "delete", remote: true do %>
    <p>bad解除</p>
    <%#= image_tag 'bad_1.svg' %>
  <% end %>
  <span><%= @bad_count %></span>
<% else %>
  <%= link_to "/communities/#{@community.id}/ques/#{@que.id}/answers/#{@answer.id}/bads", method: "post", remote: true do %>
    <p>badする？</p>
    <%#= image_tag 'bad_0.svg' %>
  <% end %>
  <span><%= @bad_count %></span>
<% end %>

app/views/bads/create.js.erb

$(".bad-<%= @answer.id %>").html("<%= j(render partial: 'bad') %>");

app/views/bads/destroy.js.erb

$(".bad-<%= @answer.id %>").html("<%= j(render partial: 'bad') %>");

行動規範の内容に同意します

回答2件

自己解決

_good.html.erb、_bad.html.erbをまとめたパーシャル（answers/_value.html.erb）を作り、
ajax後にそのパーシャルが読み込まれるように設定しました。

その後、カウントがうまく表示されなくなりましたが、answers/_value.html.erbの冒頭に
answerのidに紐づいた、goodまたはbadを取得する処理を記述しました。

コードを参考のために載せておきます。

answers/show.html.erb

<h2><%= @community.name %></h2>
<h1><%= @que.title %></h1>
<h2><%= @que.content %></h2>
<h1><%= @answer.title %></h1>

<div class="good-or-bad-btn">
  <%= render partial: 'value' %>
</div>

<h2><%= @answer.content %></h2>

answers/_value.html.erb

<% @good_count = Good.where(answer_id: @answer.id).count
%>
<% @bad_count = Bad.where(answer_id: @answer.id).count
%>

<% if user_signed_in? %>

  <% if Good.find_by(user_id: current_user.id, answer_id: @answer.id) %>
    <%= link_to "/communities/#{@community.id}/ques/#{@que.id}/answers/#{@answer.id}/goods", method: "delete", remote: true do  %>
      <p>good解除</p>
      <%#= image_tag 'good_1.svg' %>
    <% end %>
    <span><%= @good_count %></span>
  <% else %>
    <%= link_to "/communities/#{@community.id}/ques/#{@que.id}/answers/#{@answer.id}/goods", method: "post", remote: true do %>
      <p>goodする？</p>
      <%#= image_tag 'good_0.svg' %>
    <% end %>
    <span><%= @good_count %></span>
  <% end %>

  <% if Bad.find_by(user_id: current_user.id, answer_id: @answer.id) %>
    <%= link_to "/communities/#{@community.id}/ques/#{@que.id}/answers/#{@answer.id}/bads", method: "delete", remote: true do %>
      <p>bad解除</p>
      <%#= image_tag 'bad_1.svg' %>
    <% end %>
    <span><%= @bad_count %></span>
  <% else %>
    <%= link_to "/communities/#{@community.id}/ques/#{@que.id}/answers/#{@answer.id}/bads", method: "post", remote: true do %>
      <p>badする？</p>
      <%#= image_tag 'bad_0.svg' %>
    <% end %>
    <span><%= @bad_count %></span>
  <% end %>

<% end %>

ajax用のjsファイルは　
goods/create.js, goods/destroy.js, bads/create.js, bads/destroy.js
の4枚ありますが、内容が全部同じなので参考としてgoods/create.jsを載せておきます。

goods/create.js.erb

$(".good-or-bad-btn").html("<%= j(render partial: 'answers/value') %>");

投稿2019/12/19 07:45

hiroro0820

総合スコア13

文書に文書idがついていて、ユーザーがユーザーidで管理されていて
グッドかバッドを送るなら

バッドボタン:api?docid=123&userid=456&hyoka=-1
グッドボタン:api?docid=123&userid=456&hyoka=1

投稿2019/12/18 11:24

yambejp

総合スコア116661

hiroro0820

2019/12/18 11:49

回答してくださって、ありがとうございます。文書id、ユーザーidとは、この場合 "good-<%= @answer.id %>" "bad-<%= @answer.id %>" のことでしょうか？バッドボタン:api?docid=123&userid=456&hyoka=-1 グッドボタン:api?docid=123&userid=456&hyoka=1 が、初めて見る単語ばかりで、どう実装すればいいか、、全く分からないのです、、もう少し詳しく教えていただけませんか(>_<) お願いします、

行動規範の内容に同意します

あなたの回答