rails ajax対応の記述の仕方
受付中
回答 1
投稿
- 評価
- クリップ 1
- VIEW 1,747
ecサイトを作成中の者です。Ajax対応した動作を追加したく質問させていただきました。
使用箇所はお気に入り機能です。現在Ajax無しでの動作はお気に入り追加のボタンがありまして、そこを押すとお気に入りに追加されredirect_to root_pathでページが切り替わり、お気に入り追加ボタンが解除ボタンに変わっているというものです。この動作が少し遅いのと、ページ全体が切り替わるのが嫌だったので今回Ajaxに対応させようと思いました。
実は現在カートに商品を追加するという機能にはAjax対応できています。ですがお気に入りの方がうまくいかないので質問させていただきました。
カートの方で使ったやり方を参考に施行錯誤していたのですがうまくいきませんでした。以下コードとエラーを載せます
ターミナルでお気に入り追加した際のエラー文
(5.0ms) commit transaction
Rendering favorites/create.js.erb
Rendered favorites/create.js.erb (92.7ms)
Completed 500 Internal Server Error in 233ms (ActiveRecord: 14.3ms)
ActionView::Template::Error (Missing partial favorites/_favorite with {:locale=>[:en], :formats=>[:js, :html], :variants=>[], :handlers=>[:raw, :erb, :html, :builder, :ruby, :coffee, :jbuilder]}. Searched in:
* "/vagrant/depot-study/app/views"
):
1: $("#notice").hide();
2: $('#fav_js').html("<%=j render @favorite %>");
app/views/favorites/create.js.erb:2:in `_app_views_favorites_create_js_erb___975853424_79455600'
お気に入りの解除を行った際のターミナルエラー文
Started DELETE "/products/25/favorites" for 10.0.2.2 at 2018-05-01 11:24:14 +0000
Processing by FavoritesController#destroy as JS
Parameters: {"product_id"=>"25"}
User Load (1.9ms) SELECT "users".* FROM "users" WHERE "users"."id" = ? LIMIT ? [["id", 7], ["LIMIT", 1]]
CACHE User Load (0.0ms) SELECT "users".* FROM "users" WHERE "users"."id" = ? LIMIT ? [["id", 7], ["LIMIT", 1]]
Favorite Load (2.3ms) SELECT "favorites".* FROM "favorites" WHERE "favorites"."user_id" = ? AND "favorites"."product_id" = ? LIMIT ? [["user_id", 7], ["product_id", 25], ["LIMIT", 1]]
(0.1ms) begin transaction
SQL (4.4ms) DELETE FROM "favorites" WHERE "favorites"."id" = ? [["id", 43]]
(6.1ms) commit transaction
No template found for FavoritesController#destroy, rendering head :no_content
Completed 204 No Content in 1045ms (ActiveRecord: 14.8ms)
views/favorites/create.js.erb
$("#notice").hide();
$('#fav_js').html("<%=j render @favorite %>");
favorites_controller.rb
class FavoritesController < ApplicationController
before_action :authenticate
def create
@product = Product.find(params[:product_id])
@favorite = current_user.favorites.build(product: @product)
respond_to do |format|
if @favorite.save
format.html{redirect_to store_path, notice: "お気に入りに登録しました"}
format.js
format.json{head :ok}
else
format.html{redirect_to store_path, notice:"この商品はお気に入りに登録できません"}
end
end
end
def destroy
@favorite = current_user.favorites.find_by!(product_id: params[:product_id])
@favorite.destroy
respond_to do |format|
format.html{redirect_to store_path, notice:"お気に入りを解除しました"}
format.js
end
end
end
views/store/index.html.erb
<div id="fav_js" class="store_button">
<% unless session[:user_id].nil? %>
<% if product.favorited_by? current_user %>
<%= link_to image_tag('no_fav.png', :size => "83x30"), product_favorites_path(product), remote: true ,method: :delete %>
<% else %>
<%= link_to image_tag('add_fav.png', :size => "83x30"), product_favorites_path(product), remote: true ,method: :post %>
<% end %>
<% end %>
</div>
このような感じです。一応エラーが出ていますが、お気に入り追加や解除ボタン押した後にページ更新すると、押したことにはなっていました。
この場合どこがいけないのか全くわからないので、もしこちらご覧いただけた方で何かお気付きになられる方いましたらご教授の方よろしくお願いしますm(._.)m
正解だけでなく、ここは間違っているというご指摘だけでもとても参考になりますのでお願いいたします。
-
気になる質問をクリップする
クリップした質問は、後からいつでもマイページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
クリップを取り消します
-
良い質問の評価を上げる
以下のような質問は評価を上げましょう
- 質問内容が明確
- 自分も答えを知りたい
- 質問者以外のユーザにも役立つ
評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。
質問の評価を上げたことを取り消します
-
評価を下げられる数の上限に達しました
評価を下げることができません
- 1日5回まで評価を下げられます
- 1日に1ユーザに対して2回まで評価を下げられます
質問の評価を下げる
teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。
- プログラミングに関係のない質問
- やってほしいことだけを記載した丸投げの質問
- 問題・課題が含まれていない質問
- 意図的に内容が抹消された質問
- 過去に投稿した質問と同じ内容の質問
- 広告と受け取られるような投稿
評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。
質問の評価を下げたことを取り消します
この機能は開放されていません
評価を下げる条件を満たしてません
質問の評価を下げる機能の利用条件
この機能を利用するためには、以下の事項を行う必要があります。
- 質問回答など一定の行動
-
メールアドレスの認証
メールアドレスの認証
-
質問評価に関するヘルプページの閲覧
質問評価に関するヘルプページの閲覧
0
Ruby環境がないのであくまで導線引くことしかできませんが
no templateエラーなどはどこかで見たことがあります。
Ajax用にコントローラ用意しててもそのコントローラに対する
テンプレートファイル(View?)を用意する必要がある、だったような。
Ajaxも処理結果を返すための出力は必要なので、そのあたりですね。
teratail内をRuby Ajaxで探したところ、
似たような質問および回答があるように思いましたので、
ご確認ください。
投稿
-
回答の評価を上げる
以下のような回答は評価を上げましょう
- 正しい回答
- わかりやすい回答
- ためになる回答
評価が高い回答ほどページの上位に表示されます。
-
回答の評価を下げる
下記のような回答は推奨されていません。
- 間違っている回答
- 質問の回答になっていない投稿
- スパムや攻撃的な表現を用いた投稿
評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。
15分調べてもわからないことは、teratailで質問しよう!
- ただいまの回答率 88.22%
- 質問をまとめることで、思考を整理して素早く解決
- テンプレート機能で、簡単に質問をまとめられる
2018/05/02 19:48
2018/05/02 19:51 編集
やってみた経過も追記すると的確な回答をもらえるかもしれません。
2018/05/16 19:46