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

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

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

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

Ajax

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

Q&A

1回答

1026閲覧

remote true doの記述を足しただけでajax通信が出来てしまったのですが、何故なのか分かりません

sakoo

総合スコア1

Ruby on Rails 5

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

Ajax

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

0グッド

0クリップ

投稿2020/06/30 03:54

前提・実現したいこと

railsを使用していいね機能を実装したのでajax化したいと思い、
すでに作成していたファイルにremote: true doの部分のみを記述させていただきました。
そこからjs.erbファイルを作成しようと思ったのですが、この記述をした時点で非同期通信になってしまっているので、逆にどうなっているのか分からなくなってしまいました。どういう現象なのか分かる方いましたら教えていただきたいです。
jsファイル、js.erbファイルは一つも作成していません。

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

該当のソースコード

.content-title
= link_to "#{post.title}","#{post.link}", class: "url-name"

  • if current_user.already_liked?(post)
    = link_to post_like_path(post,post.id), method: :delete, remote: true do
    %i.fas.fa-heart
    = post.liked_users.count
  • else
    = link_to post_likes_path(post,post.id), method: :post, remote: true do
    %i.fas.fa-heart
    = post.liked_users.count
ruby

試したこと

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

ここにより詳細な情報を記載してください。

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

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

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

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

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

guest

回答1

0

remote: true が非同期通信を指定するものだからです。
但し、それを受けるcontrollerの処理が非同期向きになっていないとレスポンスは期待通りかどうかはわかりません

投稿2020/06/30 07:09

winterboum

総合スコア23567

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

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

sakoo

2020/06/30 07:59

remote: trueが非同期通信を指定するものというのはjsファイル、js.erbファイルなどのファイルを呼び出すものという認識なのですが、そうではなくて、非同期通信を行うメソッドのようなものという事でしょうか? レスポンスは期待通りかどうかはわかりませんというのは、データベースに保存されるデータが期待通りにいかないというものなのでしょうか?それともビューが期待通りにならないかもしれないという事なのでしょうか?どちらも現状問題がない事が逆に不安に感じています。 またお忙しい所回答有り難うございます!
winterboum

2020/06/30 08:07

> remote: trueが非同期通信を指定するものというのはjsファイル、js.erbファイルなどのファイルを呼び出すものという認識なのですが、そうではなくて、非同期通信を行うメソッドのようなものという事でしょうか? ブラウザーからWebサーバーへのリクエストが 非同期通信になるというだけです。 jsファイル、js.erbファイル を使ってレスポンスを返すのは controller での仕事です。 なので、 >レスポンスは期待通りかどうかはわかりません というのは、DBへの処理などは行われるが、その結果をブラウザーに返すところができていないだろうから、画面更新はできていないのでは? という意味です
sakoo

2020/07/01 02:00

返信有り難うございます。遅くなり申し訳ありません。 分かりやすく説明いただき有り難うございます。 やはり画面更新も行われてしまい、何も問題が無いようなのですが、、、 原因をもう少し考え続けてみます。 また可能性とかでも良いので何かありましたら、教えていただきたいです。 宜しくお願い致します
sakoo

2020/07/01 02:19

何故エラーが出なかったかなのですが、恐らくですが、tourbolinksが作動していてくれた為だと思われます。 tourbolinks関連の記述を全て削除してみると、ページ遷移がされなくなり当初の予定の状態に今なっております。 何故tourbolinksによって上手くいっていたのかは正直よく分からないのですが、今後jsのファイルを作成していく予定なので記述は削除しようと思います。 また今後jsファイルを作成しないのであればtourbolinksの記述を書いておいてremote:trueのみで非同期通信を行う形でコードを記述していた方が分かりやすくて良いものでしょうか?
winterboum

2020/07/01 02:26

すみません、turboはよくわからないんです。。。 それでうまく更新出来ているというとますます ??? です
sakoo

2020/07/01 05:07

いえいえ本当に有り難うございました! とりあえず実装の方はturbolinksの記述を消去し、jsを使用して進めることにしました。 私自身もよくは分からないのですが、原因はturbolinks関連であっていると思うので詳しく調べてみようと思います。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

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

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

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

ただいまの回答率
85.35%

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

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

質問する

関連した質問