Ajax非同期処理のいいねの投稿のみ挙動しない

Question

□解決したいこと

いいね機能をAjaxにて実装したいと考えております。

https://gyazo.com/4981862a465699475bcfec773839c50d

以上の動画のようにいいねの解除はできるのですが、いいねを新しく投稿すると

ActionView::Template::Error (No route matches {:action=>"destroy", :controller=>"likes", :tip_id=>#<Tip id: 25, title: "テスト", category_id: 4, description: "Lorem ipsum dolor sit amet, consectetur adipiscing...", user_id: 1, created_at: "2021-05-20 13:57:31", updated_at: "2021-05-27 22:59:36", image: nil>}, missing required keys: [:id]):
    1: <% if user_signed_in? %>
    2:   <% if current_user.already_liked?(@tip)%>
    3:     <%= link_to tip_like_path(@tip),method: :delete, remote: true do %>
    4:       <i class="fas fa-heart unlike-btn"></i>
    5:     <% end %>
    6:   <% else %>
  
app/views/likes/_like_partial.html.erb:3
app/views/likes/create.js.erb:1

以上のエラーが発生します。

rails での実装に挙動は問題ないのですが、非同期処理のいいねを押す挙動だけうまくいきません。

□仮説及び調べたこと

エラー構文の中で:action=>"destroy"が行われています。今回は新たにいいねを押すため、destroyではなくpostが起動するはずです。

つまり、２行目

<% if current_user.already_liked?(@tip)%>

が正常に起動しておらず、条件分岐ができていないと考えました。

likes_controllerでbinding.pryで値を取得して確認しました。

def create
    @like = current_user.likes.new(tip_id: params[:tip_id])
    @tip = Tip.find_by(id: params[:tip_id])
    binding.pry
    @like.save
  end

[1] pry(#<LikesController>)> current_user.already_liked?(@tip)
  Like Exists? (0.4ms)  SELECT 1 AS one FROM `likes` WHERE `likes`.`user_id` = 2 AND `likes`.`tip_id` = 25 LIMIT 1
  ↳ app/models/user.rb:17:in `already_liked?'
=> false

current_user.already_liked?(@tip)を打ち込んで確認しましたが、

値はfalseとなりました。つまり、現在のユーザーはいいねをしていない状態ということです。

これからいいねをしようとしている状態ですので、状態としては問題ないはずです。

しかし、actionはdestroyとなっており、if current_user.already_liked?(@tip)がtrueである場合の挙動をしております。

なぜこのような挙動となるかがわかりません。

もし、何か原因がお分かりの方がいらっしゃいましたらご教示ただきたくお願い申し上げます。

##□環境

rails (6.0.3.7)

ruby 2.6.5

　##□問題のコード

tips/show.html

<div class = "wrapper">
  <%= render "shared/header" %>
  <div class="main-tips-show">
    <div class="like-show" id='likes_buttons_<%= @tip.id %>'>
      <%= render partial:'likes/like_partial' %>
    </div>
    <以下省略>

_like_partial/html.erb

<% if user_signed_in? %>
  <% if current_user.already_liked?(@tip)%>
    <%= link_to tip_like_path(@tip),method: :delete, remote: true do %>
      <i class="fas fa-heart unlike-btn"></i>
    <% end %>
  <% else %>
    <%= link_to tip_likes_path(@tip),method: :post, remote: true do %>
      <i class="far fa-heart like-btn" ></i>
    <% end %>
  <% end %>
<% else %>
  <i class="far fa-heart like-btn" ></i>
<% end %>
<p><%=@tip.likes.count %> </p>

create.js.erb 及び　destroy.js.erb

$('#likes_buttons_<%= @tip.id %>').html("<%= j(render partial: 'likes/like_partial') %>");

likes_controller.rb 

class LikesController < ApplicationController
  def create
    @like = current_user.likes.new(tip_id: params[:tip_id])
    @tip = Tip.find_by(id: params[:tip_id])
    binding.pry
    @like.save
  end

  def destroy
    @like = Like.find_by(tip_id: params[:tip_id], user_id: current_user.id)
    @like.destroy
    @tip = Tip.find_by(id: params[:tip_id])
  end
end

user.rb

class User < ApplicationRecord
  devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :validatable

  validates :nickname, presence: true, length: { maximum: 6 }
  validates :password, presence: true, format: { with: /[a-z\d]{6,}/i, message: 'は半角英数６文字以上としてください' }
  with_options presence: true, format: { with: /\A[ぁ-んァ-ヶ一-龥々]+\z/, message: 'には全角文字を使用してください' } do
    validates :last_name
    validates :first_name
  end

  has_many :tips
  has_many :comments
  has_many :likes
  has_many :liked_tips, through: :likes, source: :tip
  def already_liked?(tip)　　　　　　　#←すでにいいねしているかの記述
    self.likes.exists?(tip_id: tip.id)　
  end
end

Answer 1

postが起動しているんです。
結果 likeが作られて、already_liked? の状態となります。
viewを書き換えるときにエラーとなっています。

ということで再描画するときの @tip があやしいのですが、
binding.pry のタイミングで @tipはどうなってますか？

Comments

[denisov]

ご回答ありがとうございます。
postが起動しているんです。
結果 likeが作られて、already_liked? の状態となります。
viewを書き換えるときにエラーとなっています。
→
like（いいね）を実行した後にalready_liked?のフィルタリングがかかるために、already_liked?はtrueとなってしまう。そのためmethod:destroyとなる
ということでしょうか。初心者のため、認識違いがりましたら申し訳ございません。

ということで再描画するときの @tip があやしいのですが、
binding.pry のタイミングで @tipはどうなってますか？
→
質問の位置の　binding.pryの位置にて行いました。
```
[1] pry(#<LikesController>)> @tip
=> #<Tip:0x00007fa077de9fd0
id: 25,
title: "テスト",
category_id: 4,
description:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
user_id: 1,
created_at: Thu, 20 May 2021 13:57:31 UTC +00:00,
updated_at: Thu, 27 May 2021 22:59:36 UTC +00:00,
image: nil>
```

[winterboum]

tip_like_path なので、tip と like の idが必要です。like のが渡っていないですね。

[denisov]

ご回答ありがとうございます。

tip_like_path なので、tip と like の idが必要です。like のが渡っていないですね。
→＠tipにlike_idを付与することで
<%= link_to tip_like_path(@tip),method: :delete, remote: true do %>
が実行できるのではないかということでしょうか。

今回はこれからいいねをする挙動がうまくいっていない状態ですので、likeの　idはnilではないでしょうか。
なお、同じbynding.pryの位置で@likeを入れてみたところnilとなりました。
```
[1] pry(#<LikesController>)> @like
=> #<Like:0x00007f875fed1398 id: nil, tip_id: 25, user_id: 1, created_at: nil, updated_at: nil>
```
今回はpostメソッドを実行したいのでtip_likes_pathを実行させるため、<%= link_to tip_like_path(@tip),method: :delete, remote: true do %>を実行させないように、<% if current_user.already_liked?(@tip)%>で正しくフィルタリングするものと思っておりました。

私の理解が甘く意図を理解できないようでしたら申し訳ございません。

[winterboum]

いえ、そこ(save)はうまくいって、結果表示で失敗してます、
ですので、@likeはidもっているはず

[denisov]

ご回答ありがとうございます。

アドバイスを参考にしたところ同様の質問者様がいらっしゃったので参考にしました。
https://teratail.com/questions/289782

<%= link_to tip_like_path(@tip,@like),method: :delete, remote: true do %>
とし、@likeと@tip　の２つのidを取ろうと思いましたが、うまく行きませんでした。
likeのidがnilでした。

```
ActionView::Template::Error (No route matches {:action=>"destroy", :controller=>"likes", :id=>nil, :tip_id=>"25"}, missing required keys: [:id]):
1: <% if user_signed_in? %>
2: <% if current_user.already_liked?(@tip)%>
3: <%= link_to tip_like_path(@tip, @like),method: :delete, remote: true do %>
4: <i class="fas fa-heart unlike-btn"></i>
5: <% end %>
6: <% else %>

app/views/likes/_like_partial.html.erb:3
app/views/tips/show.html.erb:5
```
こちらのエラーはrails上でのエラー（ページで表示）でした。

[winterboum]

binding.pry のところで @like.save して、
@like と @like.errors.messages を見てください

[denisov]

ご回答ありがとうございます。
以下内容となります。

2: def create
3: @like = current_user.likes.new(tip_id: params[:tip_id])
4: @tip = Tip.find_by(id: params[:tip_id])
=> 5: binding.pry
6: @like.save
7: end

[1] pry(#<LikesController>)> @like.save
(0.3ms) BEGIN
↳ (pry):1:in `create'
Tip Load (1.6ms) SELECT `tips`.* FROM `tips` WHERE `tips`.`id` = 25 LIMIT 1
↳ (pry):1:in `create'
Like Exists? (0.6ms) SELECT 1 AS one FROM `likes` WHERE `likes`.`tip_id` = 25 AND `likes`.`user_id` = 1 LIMIT 1
↳ (pry):1:in `create'
Like Create (9.9ms) INSERT INTO `likes` (`tip_id`, `user_id`, `created_at`, `updated_at`) VALUES (25, 1, '2021-05-30 11:22:37.624287', '2021-05-30 11:22:37.624287')
↳ (pry):1:in `create'
(1.3ms) COMMIT
↳ (pry):1:in `create'
=> true
[2] pry(#<LikesController>)> @like
=> #<Like:0x00007faee2b4cdf8 id: 151, tip_id: 25, user_id: 1, created_at: Sun, 30 May 2021 11:22:37 UTC +00:00, updated_at: Sun, 30 May 2021 11:22:37 UTC +00:00>
[3] pry(#<LikesController>)> @like.errors.messages
=> {}

何度も申し訳ございません。

[denisov]

_like_partial.html.erb

<%= link_to tip_like_path(@tip),method: :delete, remote: true do %>
を
<%= link_to tip_like_path(id: @tip.likes[0].id, tip_id: @tip.id),method: :delete,　remote: true do %>
としたらできました。

ご指摘の通り、idが指定されていなかったことが原因でした。
@tipからlikeのidを指定することで解決できました。

ありがとうございましました。