Rails6 非同期いいね機能実装 表示変わらない

Question

前提・実現したいこと

同期でいいね機能はできている。

非同期でいいね機能を実装したい。

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

いいねをクリックしても表示が変わらない。
ページを更新すると、下記エラーが検証ツールのコンソールに出てくる。

上記のエラーの続きのURLをクリックすると２箇所に302が出ている。
swiper-bundle.min.css
swiper-bundle.min.js

Resource interpreted as Stylesheet but transferred with MIME type text/plain

上記のエラーの続きのURLをクリックすると２箇所に302が出ている。
swiper-bundle.min.css
swiper-bundle.min.js

該当のソースコード

like(いいね用)コントローラー

class LikesController < ApplicationController
  before_action :idea_params

  def create
    Like.create(user_id: current_user.id, idea_id: params[:id])
  end

  def destroy
    Like.find_by(user_id: current_user.id, idea_id: params[:id]).destroy
  end

  private

  def idea_params
    @idea = Idea.find(params[:id])
  end
end

投稿詳細ページ
(views/ideas/show.idea.html.erb)

該当コードのみ記載

<tr class="idea_<%= @idea.id %>">
 <%= render 'like', idea: @idea %>
</tr>

like部分テンプレート
(views/ideas/_like.html.erb)

<% if current_user.liked_by?(idea.id) %>
  <td><%= link_to 'いいねを外す', destroy_like_path(idea), method: :DELETE, remote: true %> <%= idea.likes.count %></td>
<% else %>
  <td><%= link_to 'いいね', create_like_path(idea), method: :POST, remote: true %> <%= idea.likes.count %></td>
<% end %>

(views/likes/create.js.erb)
(views/likes/destroy.js.erb)

$(".idea_<%= @idea.id %>").html("<%= j(render 'ideas/like',  idea: @idea ) %>");

試したこと

302 Found とはURL変わりました。※一時的な変更です。
「そのうちまた使えるようになります」って検索エンジンにお伝えする。
サイトのメンテナンスなどで、一時的に別ページに飛ばす時などに使用されています。

なので、renderがうまく行っていないと推測。
create.jsとdestroy.jsをideasフォルダに移して部分テンプレートに指定も変更する。
すると、302のエラーは出なくなったが、表示が変わらない。

つまり、DBに保存されていないから、表示が変わらなかった？
いいねをクリックしただけでは、DBに保存出来ていない。
再読み込みすれば、保存されている。

非同期でDBを更新の仕方検索したのですが、答えにたどり着かず、、、

Ajaxの流れを再整理
①イベント発生
②非同期でリクエスト送信
③受け取った情報を処理
④処理結果をJSON形式で応答
⑤レスポンスを受けてDOMでページ更新

②が出来ていないから、DBに保存されず表示が変わらなかった？
下記を追加

def create
   binding.pry
   Like.create(user_id: current_user.id, idea_id: params[:id])
end

params[:id]で送られてきている値を確認
投稿のidが送られていることを確認

user_idがなかったので、
Like.allで保存されているデータを確認

投稿のidとuser_idを確認
保存はされているので、レンダリングの問題

(views/likes/create.js.erb)にて binding.pryで確認

@idea

投稿のデータが返ってきており、
user_idはcurrent_user

@idea.likes

id: 40,
user_id: 2,
idea_id: 7,

処理自体は出来ていそう。
ページ更新の部分が出来ていない？
つまり、部分テンプレートが保存の処理後にもう一度読み込めば表示が変わる。

def create
  Like.create(user_id: current_user.id, idea_id: params[:id])
  @idea = Idea.includes(:likes).find_by(id: params[:id])
end

上記を追加したが、変わらず

補足情報（FW/ツールのバージョンなど）

ruby 2.6.5
jQuery 3.5.1

Answer 1

<td>を<div>に変更したら、うまくいきました。