質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.82%

Ajaxでいいね!値の更新がされない。

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 784

tomtom1

score 128

前提・実現したいこと

現在、Ajax無しではredirect_toで処理でいいね!処理をしている状態です。そこでAjaxと取り入れ、ページの更新無しに部分更新をしたく存じます。
https://qiita.com/naberina/items/c6b5c8d7756cb882fb20を参考に作っています。

しかし、いいね!ボタンを押すと、反応はなく、ページ更新すると反映されます。
ログを確認すると、jsファイルへpostの値をうまく渡せずにエラーを起こしています。

エラー

*いいね!create時
Started POST "/likes/3/create" for 127.0.0.1 at 2019-06-14 14:53:51 +0900
Processing by LikesController#create as JS
  Parameters: {"post_id"=>"3"}
  User Load (0.2ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = ? LIMIT ?  [["id", 1], ["LIMIT", 1]]
  ↳ app/controllers/application_controller.rb:6
  Post Load (0.2ms)  SELECT  "posts".* FROM "posts" WHERE "posts"."id" IS NULL LIMIT ?  [["LIMIT", 1]]
  ↳ app/controllers/likes_controller.rb:7
   (0.1ms)  begin transaction
  ↳ app/controllers/likes_controller.rb:9
  CACHE User Load (0.0ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = ? LIMIT ?  [["id", 1], ["LIMIT", 1]]
  ↳ app/controllers/likes_controller.rb:9
  Post Load (0.3ms)  SELECT  "posts".* FROM "posts" WHERE "posts"."id" = ? LIMIT ?  [["id", 3], ["LIMIT", 1]]
  ↳ app/controllers/likes_controller.rb:9
  Like Create (0.5ms)  INSERT INTO "likes" ("user_id", "post_id", "created_at", "updated_at") VALUES (?, ?, ?, ?)  [["user_id", 1], ["post_id", 3], ["created_at", "2019-06-14 05:53:51.570765"], ["updated_at", "2019-06-14 05:53:51.570765"]]
  ↳ app/controllers/likes_controller.rb:9
   (1.0ms)  commit transaction
  ↳ app/controllers/likes_controller.rb:9
  Rendering likes/create.js.erb
  Rendered likes/create.js.erb (18.0ms)
Completed 500 Internal Server Error in 112ms (ActiveRecord: 2.2ms)



ActionView::Template::Error (undefined method `id' for nil:NilClass):
    1: $('#likes_buttons_<%= @post.id %>').html("<%= j(render partial: 'likes/like', locals: {post: @post}) %>");

app/views/likes/create.js.erb:1:in `_app_views_likes_create_js_erb___1624215930080801267_70224208720440'

*いいね!destroy時
Started POST "/likes/3/destroy" for 127.0.0.1 at 2019-06-14 14:46:30 +0900
Processing by LikesController#destroy as JS
  Parameters: {"post_id"=>"3"}
  User Load (0.2ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = ? LIMIT ?  [["id", 1], ["LIMIT", 1]]
  ↳ app/controllers/application_controller.rb:6
  Post Load (0.2ms)  SELECT  "posts".* FROM "posts" WHERE "posts"."id" IS NULL LIMIT ?  [["LIMIT", 1]]
  ↳ app/controllers/likes_controller.rb:15
  Like Load (0.2ms)  SELECT  "likes".* FROM "likes" WHERE "likes"."user_id" = ? AND "likes"."post_id" = ? LIMIT ?  [["user_id", 1], ["post_id", 3], ["LIMIT", 1]]
  ↳ app/controllers/likes_controller.rb:16
   (0.1ms)  begin transaction
  ↳ app/controllers/likes_controller.rb:17
  Like Destroy (0.4ms)  DELETE FROM "likes" WHERE "likes"."id" = ?  [["id", 27]]
  ↳ app/controllers/likes_controller.rb:17
   (1.0ms)  commit transaction
  ↳ app/controllers/likes_controller.rb:17
  Rendering likes/destroy.js.erb
  Rendered likes/destroy.js.erb (22.8ms)
Completed 500 Internal Server Error in 116ms (ActiveRecord: 2.0ms)



ActionView::Template::Error (undefined method `id' for nil:NilClass):
    1: $('#likes_buttons_<%= @post.id %>').html("<%= j(render partial: 'likes/like', locals: {post: @post}) %>");

app/views/likes/destroy.js.erb:1:in `_app_views_likes_destroy_js_erb__3123402465132948964_70224203960620'


ちなみに、@post→postに変更した場合、ActionViewはこのような記載になります。

*いいね!create時
ActionView::Template::Error (undefined local variable or method `post' for #<#<Class:0x00007fbcb1769a60>:0x00007fbcad37bd30>
Did you mean?  @post
               @posts):
    1: $('#likes_buttons_<%= post.id %>').html("<%= j(render partial: 'likes/like', locals: {post: post}) %>");
*いいね!destroy時
ActionView::Template::Error (undefined local variable or method `post' for #<#<Class:0x00007fbcb1769a60>:0x00007fbcb16a9cd8>
Did you mean?  @post
               @posts):
    1: $('#likes_buttons_<%= post.id %>').html("<%= j(render partial: 'likes/like', locals: {post: post}) %>");

コード

<% @posts.each do |post| %>
<div id='likes_buttons_<%= post.id %>'>
    <%= render partial: 'likes/like', locals: { post: post} %>
    </div>
<% end %>
*_like.html.erb
      <% if Like.find_by(user_id: @current_user.id, post_id: post.id) %>
        <%= link_to("/likes/#{post.id}/destroy", method: :post, remote: true) do %>
          <span class="fa fa-heart icon-size like-btn-unlike"></span>
          <% end %>
      <% else %>
        <%= link_to("/likes/#{post.id}/create", method: :post, remote: true) do %>
        <span class="fa fa-heart icon-size like-btn"></span>
        <% end %>
      <% end %>
      <%= Like.where(post_id: post).count %>
*create.js.erb
$('#likes_buttons_<%= @post.id %>').html("<%= j(render partial: 'likes/like', locals: {post: @post}) %>");
*create.js.erb
$('#likes_buttons_<%= @post.id %>').html("<%= j(render partial: 'likes/like', locals: {post: @post}) %>");
*application.js
//= require rails-ujs
//= require jquery
//= require jquery_ujs
//= require activestorage
//= require turbolinks
//= require_tree .
class LikesController < ApplicationController
  before_action :authenticate_user

  def create
    @posts = Post.all.order(created_at: :desc)
    @post = Post.find_by(id: params[:id])
    @like = Like.new(user_id: @current_user.id, post_id: params[:post_id])
    @like.save
  end
  def destroy
    @posts = Post.all.order(created_at: :desc)
    @post = Post.find_by(id: params[:id])
    @like = Like.find_by(user_id: @current_user.id, post_id: params[:post_id])
    @like.destroy
  end
end
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • hatsu

    2019/06/14 23:58

    likes_controller.rb?のようないいねを動作しているコントローラー(LIkeクラスのCreateメソッドとか)があれば見せていただけると参考になりそうです...!

    キャンセル

  • tomtom1

    2019/06/16 21:34

    ありがとうございます!追記致しましたので、ご確認頂ければ幸いです!

    キャンセル

回答 1

checkベストアンサー

0

LikesControllerのCreateメソッドではおそらく

  • @like.saveでlikeを保存すること
  • $('#likes_buttons_<%= @post.id %>').html("<%= j(render partial: 'likes/like', locals: {post: @post}) %>");で必要な@postという変数を返すこと

をする必要があると思います。
で、エラー内容を見ると@postが無いと言われています。そこで、@postを返すために以下のようにするといかがでしょうか?

def create
  @like = Like.new(user_id: @current_user.id, post_id: params[:post_id])
  @like.save
  @post = @like.post
end

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/12/17 19:39

    随分と返信に時間が経ってしまいました!申し訳ありません。当時全然理解していなかったのですが、現在に至り本件を理解し解決できました!@post = @like.postつけてエラー解決です。ありがとうございます!

    キャンセル

  • 2019/12/17 20:52

    よかったです😊

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.82%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る