回答編集履歴

3

日本語が変な気がしたので、文言を修正しました。

2020/02/26 10:17

投稿

kyoruni
kyoruni

スコア93

test CHANGED
@@ -64,7 +64,7 @@
64
64
 
65
65
 
66
66
 
67
- **→ index.js.erb処理を、すでに作成している `create.js.erb`と`destroy.js.erb`に記載すると良いのではないでしょうか…?**
67
+ **→ index.js.erbに書いたような処理を、すでに作成している `create.js.erb`と`destroy.js.erb`に記載すると良いのではないでしょうか…?**
68
68
 
69
69
 
70
70
 

2

追加していただいたコードを拝見したので、内容を追記しました。

2020/02/26 10:16

投稿

kyoruni
kyoruni

スコア93

test CHANGED
@@ -11,3 +11,65 @@
11
11
 
12
12
 
13
13
  リクエストを送ってもHTMLの中身はそのままなので、フォローボタンの表示は変わりません。リロードせずにHTMLの中身を変更したい場合は、jQuery側で書き換えてあげる必要があります。
14
+
15
+
16
+
17
+ **- - - - - - ↓ 以下追記です ↓ - - - - - - -**
18
+
19
+
20
+
21
+ Ajaxのリクエストについてですが、コントローラーの下記部分に記載があります。
22
+
23
+
24
+
25
+ ```ruby
26
+
27
+ class RelationshipsController < ApplicationController
28
+
29
+ def create
30
+
31
+ @user = User.find(params[:relationship][:following_id])
32
+
33
+ @current_user.follow!(@user)
34
+
35
+ respond_to do |format|
36
+
37
+ format.html { redirect_to @user }
38
+
39
+ format.js # ← ★★★ この部分 ★★★
40
+
41
+ end
42
+
43
+ end
44
+
45
+ ```
46
+
47
+
48
+
49
+ Relationshipsのcreateアクションでは `app/views/relationships/create.js.erb` が、
50
+
51
+ Relationshipsのdestroyアクションでは `app/views/relationships/destroy.js.erb` が呼ばれます。
52
+
53
+
54
+
55
+ **→ index.js.erbにフォローボタンの処理を書いても、それを呼び出す記述がないので動きません。**
56
+
57
+
58
+
59
+ (参考サイトも拝見しましたが、そちらではコントローラーのcreateアクションとdestroyアクションの中でindex.js.erbを呼び出しているようです)
60
+
61
+
62
+
63
+ 今回の場合であれば、フォローボタンの処理だけをindex.js.erbに分けて書くのではなく、「createアクションで動かす処理はcreate.js.erb」 「destroyアクションで動かす処理はdestroy.js.erb」に書いた方が分かりやすいのではないかと思います。
64
+
65
+
66
+
67
+ **→ index.js.erbの処理を、すでに作成している `create.js.erb`と`destroy.js.erb`に記載すると良いのではないでしょうか…?**
68
+
69
+
70
+
71
+ **【 参考ページ 】** [Rails で JavaScript を使用する - Railsガイド](https://railsguides.jp/working_with_javascript_in_rails.html)
72
+
73
+
74
+
75
+ - 「4.1 シンプルな例」 の辺り

1

文章中、主語が抜けていたので修正しました。

2020/02/26 10:13

投稿

kyoruni
kyoruni

スコア93

test CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
 
4
4
 
5
- 「フォローボタンを押した時の処理」に「アンフォローボタンを表示する」、「アンフォローボタンを押した時の処理」に「フォローボタンを表示する」コードを追加してあげれば、やりたかったことが実現できるのではないかなと思います。
5
+ 「フォローボタンを押した時の処理」に「jQuery側でアンフォローボタンを表示する」、「アンフォローボタンを押した時の処理」に「jQuery側でフォローボタンを表示する」コードを追加してあげれば、やりたかったことが実現できるのではないかなと思います。
6
6
 
7
7
 
8
8