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

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

ただいまの
回答率

88.91%

【rails】js.erbを使ったajaxがうまくいかない

受付中

回答 0

投稿

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

kickthekaz

score 24

rails6にて、ajaxとkaminariを使って、口コミ一覧の「もっと見る」機能を作りたいのですが、エラーでうまく出来ません。
ご助言いただけますと幸いです。。

状況)
こちらの記事を参考にして、進めてみましたが、エラーになってしまいます。

show.slim

.review_lists
  = render 'reviews'
= link_to_next_page @reviews, 'もっと見る', remote: true, id: 'more_link'

_reviews.slim

- @reviews.each do |review|
  .review_list
    .review_top
      span #{review.name}さん

    .review_review
      p 評価:#{review.rating}
      p 良いところ
      p.review_review__comment = review.good_point
      p 悪いところ
      p.review_review__comment = review.bad_point

    .review_time 投稿日時: #{review.created_at.strftime("%Y年%m月%d日 %H:%M")}

show.js.erb

$(".review_lists").append("<%= j(render 'reviews') %>");
$("#more_link").replaceWith("<%= j(link_to_next_page @reviews, 'もっと見る', remote: true, id: 'more_link') %>");

controllers

  def show
    @card = Card.find(params[:id])
    @reviews = Review.where(card_id: @card).page(params[:page]).per(3)
  end

log

Started GET "/cards/1?page=2" for ::1 at 2020-07-15 14:41:27 +0900
Processing by CardsController#show as JS
  Parameters: {"page"=>"2", "id"=>"1"}
  Card Load (0.5ms)  SELECT `cards`.* FROM `cards` WHERE `cards`.`id` = 1 LIMIT 1
  ↳ app/controllers/cards_controller.rb:8:in `show'
  Rendering cards/show.js.erb within layouts/application
  Review Load (0.7ms)  SELECT `reviews`.* FROM `reviews` WHERE `reviews`.`card_id` = 1 LIMIT 3 OFFSET 3
  ↳ app/views/cards/_reviews.slim:1
  Rendered cards/_reviews.slim (Duration: 6.3ms | Allocations: 1869)
   (1.0ms)  SELECT COUNT(*) FROM `reviews` WHERE `reviews`.`card_id` = 1
  ↳ app/views/cards/show.js.erb:2
  Rendered cards/show.js.erb within layouts/application (Duration: 19.1ms | Allocations: 5731)
[Webpacker] Everything's up-to-date. Nothing to do
  Rendered _particals/_header.slim (Duration: 3.4ms | Allocations: 1290)
  Table Load (0.6ms)  SELECT `tables`.* FROM `tables`
  ↳ app/views/_particals/_footer.slim:16
  Public Load (0.4ms)  SELECT `publics`.* FROM `publics`
  ↳ app/views/_particals/_footer.slim:25
  Status Load (0.3ms)  SELECT `statuses`.* FROM `statuses`
  ↳ app/views/_particals/_footer.slim:34
  Mile Load (0.3ms)  SELECT `miles`.* FROM `miles`
  ↳ app/views/_particals/_footer.slim:42
  Business Load (0.3ms)  SELECT `businesses`.* FROM `businesses`
  ↳ app/views/_particals/_footer.slim:51
  Company Load (0.5ms)  SELECT `companies`.* FROM `companies`
  ↳ app/views/_particals/_footer.slim:59
  Rendered _particals/_footer.slim (Duration: 22.7ms | Allocations: 9444)
Completed 200 OK in 106ms (Views: 89.3ms | ActiveRecord: 4.5ms | Allocations: 29164)

エラー内容)

ブラウザのコンソールにて以下のエラーが出ております。

VM602:1 Uncaught SyntaxError: Unexpected token '<'
    at processResponse (rails-ujs.js:283)
    at rails-ujs.js:196
    at XMLHttpRequest.xhr.onreadystatechange (rails-ujs.js:264)

試した事)
別のアプリ(rails5.2)で、同様に「もっと見る」機能を作ったのですが、問題なく成功しました。

rails6では、エラーになるということは、
webpackにて何か調整が必要なのでしょうか??

ご教授いただけますと幸いです。

以上、よろしくお願いします!

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

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

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

    クリップを取り消します

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

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

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

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

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

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

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

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

    質問の評価を下げる

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

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

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

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

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

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

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

    詳細な説明はこちら

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

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

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

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

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

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

関連した質問

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