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

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

新規登録して質問してみよう
ただいま回答率
85.35%
MySQL

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

非同期処理

非同期処理とは一部のコードを別々のスレッドで実行させる手法です。アプリケーションのパフォーマンスを向上させる目的でこの手法を用います。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Q&A

0回答

569閲覧

いいね機能の実装をAjaxでしたい

tomo_345

総合スコア0

MySQL

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

非同期処理

非同期処理とは一部のコードを別々のスレッドで実行させる手法です。アプリケーションのパフォーマンスを向上させる目的でこの手法を用います。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

0グッド

0クリップ

投稿2020/09/22 03:33

編集2020/09/22 04:02

前提・実現したいこと

実現したいことはいいねを押したらその場でいいねボタンの表示が切り替わるようにしたいです。
いいね機能をAjaxで実装したいのですがredirect_toの記述をコメントアウトすると下記のようなエラーがターミナル上で出てしまいます。手動でブラウザの更新をするといいねの表示やDBに記録はされるのですが更新をしないといけません。また今はコメントアウトしているredirect_toの記述をlike_controller.rbで追加している場合には非同期通信になっていて更新はされないが、一番上に行ってしまいます。どこかおかしな記述があればご指摘していただきたく今回投稿しております。よろしくお願いいたします。
足りない情報などがございましたら教えてくれたら幸いです。

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

ターミナル ActionView::Template::Error (undefined method `id' for nil:NilClass): 1: <% if Like.find_by(user_id: current_user.id, idea_id: @idea.id) %> 2: <%= link_to (idea_like_path(@idea.id)), method: :delete, id: "like-button", remote: true do %> 3: <span class="fa fa-heart like-btn-unlike"></span> 4: <%= @likes_count %>

該当のソースコード

shared/_like.html.erb

<% if Like.find_by(user_id: current_user.id, idea_id: @idea.id) %> <%= link_to (idea_like_path(@idea.id)), method: :delete, id: "like-button", remote: true do %> <span class="fa fa-heart like-btn-unlike"></span> <%= @likes_count %> <% end %> <% else %> <%= link_to (idea_likes_path(@idea.id)), method: :post, id: "like-button", remote: true do %> <span class="fa fa-heart like-btn"></span> <%= @likes_count %> <% end %> <% end %>

like_controller.rb

class LikesController < ApplicationController def create @like = Like.new(user_id: current_user.id, idea_id: params[:idea_id]) @like.save # redirect_to("/ideas/#{params[:idea_id]}") ここをコメントアウトしています。 end def destroy @like = Like.find_by(user_id: current_user.id, idea_id: params[:idea_id]) @like.destroy # redirect_to("/ideas/#{params[:idea_id]}") ここをコメントアウトしています。 end end

likes/create.js.erb

$('.fa fa-heart like-btn').append("<%= escape_javascript(render 'shared/like', locals: { idea: @idea }) %>");

###likes/destroy.js.erb

$('.fa fa-heart like-btn-unlike').append("<%= escape_javascript(render 'shared/like', locals: { idea: @idea }) %>");

###ideas_controller.rb

class IdeasController < ApplicationController before_action :login_check, only: [:new, :show] def index @ranks = Idea.order('likes_count DESC').limit(3) @novelties = Idea.order('created_at DESC').limit(3) end def new @idea = Idea.new end def create @idea = Idea.new(idea_params) if @idea.save redirect_to root_path else render :new end end def show @idea = Idea.find(params[:id]) @likes_count = Like.where(idea_id: @idea.id).count @comment = Comment.new @comments = @idea.comments.includes(:user) end def edit @idea = Idea.find(params[:id]) end def update @idea = Idea.find(params[:id]) if @idea.update(idea_params) redirect_to ideas_path else render :edit end end def destroy @idea = Idea.find(params[:id]) if @idea.destroy redirect_to ideas_path else render :show end end private def idea_params params.require(:idea).permit(:genre_id, :image, :title, :content).merge(user_id: current_user.id) end def message_params params.require(:idea).permit(:image, :title).merge(user_id: current_user.id) end # ログインしていない場合登録画面に遷移する def login_check unless user_signed_in? flash[:alert] = 'ログインしてください' redirect_to new_user_session_path end end end

show.html.erb

<div class="show"> <div class="idea-show"> <div class="idea-title"> <h1 class="title"> <%= @idea.title %> </h1> </div> <div class="idea-img"> <%= image_tag @idea.image, class: "idea-image" if @idea.image.attached? %> </div> <div class="idea-content"> <%= @idea.content %> </div> <%= render 'shared/like', locals: { idea: @idea, like: @like } %> </div> </div>

###routes.rb

Rails.application.routes.draw do devise_for :users root to: "ideas#index" resources :ideas do resources :likes, only: [:create, :destroy] resources :comments, only: :create end end

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

rails6
mysql2

気になる質問をクリップする

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

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

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問