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

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

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

CoffeeScriptはプログラミング言語です。シンタックスシュガーの導入により、JavaScriptのコードに変換された後動作します。JavaScriptに比べ、可読性と簡潔性が向上しています。

Ruby on Rails

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

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

0回答

2045閲覧

button_toからAjaxで画像を切り替えるLikeボタン

hrc

総合スコア55

CoffeeScript

CoffeeScriptはプログラミング言語です。シンタックスシュガーの導入により、JavaScriptのコードに変換された後動作します。JavaScriptに比べ、可読性と簡潔性が向上しています。

Ruby on Rails

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

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2017/01/01 22:39

RoRでAjax処理を用いて画像を押すと画像が切り替わるLikeボタンを実装しようとしています。
実際にはUpholdという名前にしていまして、KnowledgeSproutという記事の中につけようとしております。
以下そのコードとRoute処理なのですが、DBにUpholdした結果は入るのに画像が動的に切り替わりません。恐らくjQueryのイベントハンドリングがうまく行ってないからなのですが、どう修正すればいいのかわかりません。どなたかご教示いただけませんでしょうか?よろしくお願いします

ruby

1class UpholdsController < ApplicationController 2 def create 3 @uphold = Uphold.create(user_id: current_user.id, knowledge_sprout_id: param 4s[:knowledge_sprout_id], answer_id: params[:answer_id], review_id: params[:revie 5w_id], product_review_id: params[:product_review_id]) 6 @knowledge_sprouts = KnowledgeSprout.find(params[:knowledge_sprout_id]) 7 end 8end 9

コントローラです。

ruby

1class KnowledgeSproutsController < ApplicationController 2 3 def show 4 @knowledge_sprout = KnowledgeSprout.find_by(id: params[:id]) 5 @q = Restaurant.ransack(params[:q]) 6 if params[:q].present? 7 @restaurants = @q.result(distinct: true).page(params[:page]) 8 end 9 @answers = Answer.where(ks_id: params[:id]) 10 @answer = Answer.new 11 ahoy.track "ks_show", id: params[:id] 12 end 13end 14

こちらはViewの knowledege_sprout.html.slim です。

ruby

1.upholds 2 = render partial: "uphold", locals: {knowledge_sprout: @knowledge_sprout} 3

ここがPartialの_uphold.html.slimの箇所です。

ruby

1 - if user_signed_in? 2 - if @knowledge_sprout.uphold_user(current_user.id) 3 = image_tag("icon_red_heart.png") 4 span 5 = @knowledge_sprout.upholds_count 6 - else 7 = button_to knowledge_sprout_upholds_path(@knowledge_sprout.id), id: "uphold-button", remote: true do 8 = image_tag("icon_heart.png") 9 span 10 = @knowledge_sprout.upholds_count 11 - else 12 - if @knowledge_sprout.uphold_user(current_user.id) 13 = image_tag("icon_red_heart.png") 14 span 15 = @knowledge_sprout.upholds_count 16 - else 17 = image_tag("icon_heart.png") 18 span 19 = @knowledge_sprout.upholds_count 20

ここがjQueryの記載箇所です。

coffeescript

1$("#uphold-button").on("ajax:success", (e, data, status, xhr) -> 2 $("#uphold-button").html("= j(render partial: 'uphold', locals: { knowledge_sprout: @knowledge_sprout})") 3).on "ajax:error", (e, xhr, status, error) -> 4 $("#uphold-button").append "<p>ERROR</p>" 5

こちらはModelのコードです。

ruby

1class KnowledgeSprout < ActiveRecord::Base 2 belongs_to :user 3 has_many :upholds, dependent: :destroy 4 5 def uphold_user(user_id) 6 upholds.find_by(user_id: user_id) 7 end 8 9 attr_accessor :file 10end 11class Uphold < ActiveRecord::Base 12 belongs_to :knowledge_sprout, counter_cache: :upholds_count 13 belongs_to :answers, counter_cache: :upholds_count 14 belongs_to :reviews, counter_cache: :upholds_count 15 belongs_to :product_reviews, counter_cache: :upholds_count 16 belongs_to :user 17end 18

こちらはrake routesの結果です。ご参考まで。

ruby

1 knowledge_sprout_upholds POST (/:locale)/knowledge_sprouts/:knowledge_sprout_id/upholds(.:format) upholds#create {:locale=>/en|ja/} 2 knowledge_sprout_uphold DELETE (/:locale)/knowledge_sprouts/:knowledge_sprout_id/upholds/:id(.:format) upholds#destroy {:locale=>/en|ja/} 3 GET (/:locale)/knowledge_sprouts(.:format) knowledge_sprouts#index {:locale=>/en|ja/} 4 POST (/:locale)/knowledge_sprouts(.:format) knowledge_sprouts#create {:locale=>/en|ja/} 5 GET (/:locale)/knowledge_sprouts/new(.:format) knowledge_sprouts#new {:locale=>/en|ja/} 6 GET (/:locale)/knowledge_sprouts/:id/edit(.:format) knowledge_sprouts#edit {:locale=>/en|ja/} 7 GET (/:locale)/knowledge_sprouts/:id(.:format) knowledge_sprouts#show {:locale=>/en|ja/} 8 PATCH (/:locale)/knowledge_sprouts/:id(.:format) knowledge_sprouts#update {:locale=>/en|ja/} 9 PUT (/:locale)/knowledge_sprouts/:id(.:format) knowledge_sprouts#update {:locale=>/en|ja/} 10 DELETE (/:locale)/knowledge_sprouts/:id(.:format)

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

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

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

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

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

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

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

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

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問