Ajaxが反応しない 『いいね機能の実装』

Question

Ruby初学者です。

ご教授いただけると幸いです。

【いいね機能を実装したい】

【悩んでいること】
・Ajaxが反応しない
→ブラウザを更新すると反映されるのですが、Ajaxで切り替わりません。

【コード】

likes/_like_item_button.html.erb

<% if current_user.already_liked?(@item) %>
  <%= link_to item_likes_path(@item), method: :delete, remote: true do %>
    <i class="fas fa-heart "></i>
  <% end %>
  <%= item.likes.count%>
<% else %>
  <%= link_to item_likes_path(@item), method: :post, remote: true do %>
    <i class="far fa-heart "></i>
  <% end %>
  <%= item.likes.count%>
<% end %>

create.js.erb

$("#like-button").html("<%= j(render partial: 'likes/like_item_button', locals: {item: @item}) %>");

destroy.js.erb

$("#like-button").html("<%= j(render partial: 'likes/like_item_button', locals: {item: @item}) %>");

likes_controller

class LikesController < ApplicationController
  before_action :authenticate_user!

  
  def create
    @item = Item.find_by(id:params[:item_id])
    current_user.likes.create!(item_id: @item.id)
  end

  def destroy
    @item = Item.find_by(id:params[:item_id])
    current_user.likes.find_by(item_id: @item.id).destroy!
  end
end

Answer 1

下記のようにして、createアクションの最後にcreate.js.erbを呼び出すようにすると良いかと思います。
destroyアクションも同じです。

  def create
    @item = Item.find_by(id:params[:item_id])
    current_user.likes.create!(item_id: @item.id)
    respond_to do |format|
      format.js
    end
  end

  def destroy
    @item = Item.find_by(id:params[:item_id])
    current_user.likes.find_by(item_id: @item.id).destroy!
    respond_to do |format|
      format.js
    end
  end

Comments

[komati88]

no 1 knowsさん
早速ご教示いただきまして、誠にありがとうございます。
上記の方法を試しましたが、非同期通信が反映されませんでした。
又、リロードしてもいいねが反映されなくなりました。
他に問題点がありましたら、ご指摘よろしくお願いいたします。

[no1knows]

> 又、リロードしてもいいねが反映されなくなりました。
追加したのはそれぞれのアクションの最後にリダイレクト先を設定した（respond_to do |format|〜end）だけなので、その前段階の動作（保存・削除）が動かなくなったというのは、少し変な気がしますね。
一度、respondo_to以下を削除して、再度動作確認してもらえないでしょうか？

[komati88]

respond_to以下を消したところ元の状態に戻りました。