teratail
回答率
85.47%
質問するログイン新規登録
トップに関する質問[Rails] ajaxでLike機能を実装したが、リロードしないと反映されない

編集履歴

質問編集履歴

4

更新

2017/08/17 03:16

投稿

japomondo
japomondo

スコア23

test CHANGED
@@ -1 +1 @@
1
- RailsとajaxでLike機能を実装したい
1
+ [Rails] ajaxでLike機能を実装したが、リロードしないと反映されない
test CHANGED
@@ -1,32 +1,48 @@
1
1
  ###前提・実現したいこと
2
2
 
3
- RailsとajaxでLike機能を実装したいと思っているのですが、Likeボタンを押しても反応しません。
3
+ ajaxによるLike機能を実装したいと考えています。
4
4
 
5
5
 
6
6
 
7
+ 下記の参考エントリに基づきコードを書いたのですが、Likeボタンをクリックしても反応がありません。
8
+
7
9
  コンソールに下記のエラーが出ていました。
8
-
9
- TypeError (no implicit conversion of Fixnum into String):
10
10
 
11
11
 
12
12
 
13
- が、原因が分かりませんでした。
13
+ ```
14
14
 
15
- 分かる方いらっしゃいましたら、ご教示いただけないでしょうか。
15
+ Completed 500 Internal Server Error in 673ms (ActiveRecord: 29.7ms)
16
16
 
17
17
 
18
18
 
19
- ###発生している問題
19
+ ActionView::Template::Error (undefined local variable or method `plan' for #<#<Class:0x007fd3f5972d88>:0x007fd3f5965e30>
20
20
 
21
+ Did you mean? plans):
22
+
23
+ 4: |  
24
+
25
+ 5: = plan.likes_count
26
+
27
+ 6: br
28
+
29
+ 7: - elsif plan.like_user(current_user.id)
30
+
21
- 画面上でいいねボタンを押しても、何も反応が無く、createアクション（create.js.erb）が実行されない（ハートの色が変わらない）。リロードしてもやはりハートの色は変わっていない
31
+ 8: = button_to plan_like_path([likes, like], plan_id: plan.id), method: :delete, id: "like-button", remote: true do
32
+
33
+ 9: span.heart
34
+
35
+ 10: = image_tag("icon_red_heart.svg")
36
+
37
+ ```
22
38
 
23
39
 
24
40
 
25
- ###開発環境
41
+ ところが、リロードするとLikeが増減しています。
26
42
 
27
- ・Rails 5.0.0.1
28
43
 
44
+
29
- ・cloud9
45
+ Likeボタンを押すことで、ページ遷移無しでLikeが増減するようにしたいと思っています。
30
46
 
31
47
 
32
48
 
@@ -38,77 +54,23 @@
38
54
 
39
55
 
40
56
 
41
- ###仕様
42
-
43
- - likeを導入するモデル(room)
44
-
45
- - likeをつけるモデル(user)
46
-
47
- - likeそのもののモデル(like)
48
-
49
-
50
-
51
- ###エラーメッセージ
52
-
53
- ```
54
-
55
- Started POST "/rooms/13/likes" for 10.240.0.5 at 2017-07-09 18:35:54 +0900
56
-
57
- Processing by LikesController#create as JS
58
-
59
- Parameters: {"authenticity_token"=>"Icdty4DNfXsmCseYWetGcLHSqU86Z3vHeOXby1X5ABGvGXS0F1nnluP8irwmLvdmwgcrMvhL9nZNQ2X0ovqLtA==", "room_id"=>"13"}
60
-
61
- User Load (0.3ms) SELECT "users".* FROM "users" WHERE "users"."id" = ? ORDER BY "users"."id" ASC LIMIT ? [["id", 1], ["LIMIT", 1]]
62
-
63
- (0.1ms) begin transaction
64
-
65
- SQL (1.2ms) INSERT INTO "likes" ("user_id", "room_id", "created_at", "updated_at") VALUES (?, ?, ?, ?) [["user_id", 1], ["room_id", 13], ["created_at", 2017-07-09 09:35:54 UTC], ["updated_at", 2017-07-09 09:35:54 UTC]]
66
-
67
- Room Load (0.1ms) SELECT "rooms".* FROM "rooms" WHERE "rooms"."id" = ? LIMIT ? [["id", 13], ["LIMIT", 1]]
68
-
69
- (0.5ms) rollback transaction
70
-
71
- Completed 500 Internal Server Error in 11ms (ActiveRecord: 2.2ms)
72
-
73
-
74
-
75
- TypeError (no implicit conversion of Fixnum into String):
76
-
77
-
78
-
79
- app/controllers/likes_controller.rb:3:in `create'
80
-
81
- Rendering /usr/local/rvm/gems/ruby-2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/diagnostics.text.erb
82
-
83
- Rendering /usr/local/rvm/gems/ruby-2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_source.text.erb
84
-
85
- Rendered /usr/local/rvm/gems/ruby-2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_source.text.erb (0.7ms)
86
-
87
- Rendering /usr/local/rvm/gems/ruby-2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_trace.text.erb
88
-
89
- Rendered /usr/local/rvm/gems/ruby-2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_trace.text.erb (0.8ms)
90
-
91
- Rendering /usr/local/rvm/gems/ruby-2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_request_and_response.text.erb
92
-
93
- Rendered /usr/local/rvm/gems/ruby-2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/_request_and_response.text.erb (1.2ms)
94
-
95
- Rendered /usr/local/rvm/gems/ruby-2.3.0/gems/actionpack-5.0.0.1/lib/action_dispatch/middleware/templates/rescues/diagnostics.text.erb (31.4ms)
96
-
97
- ```
98
-
99
-
100
-
101
57
  ###likes_controller.rb
102
58
 
103
59
  ```
104
60
 
105
61
  class LikesController < ApplicationController
106
62
 
63
+
64
+
65
+ before_action :set_likes
66
+
67
+ before_action :authenticate_user!
68
+
69
+
70
+
107
71
  def create
108
72
 
109
- @like = Like.create(user_id: current_user.id, room_id: params[:room_id])
73
+ @like = Like.create(user_id: current_user.id, plan_id: params[:plan_id])
110
-
111
- @likes = Like.where(room_id: params[:room_id])
112
74
 
113
75
  end
114
76
 
@@ -116,13 +78,21 @@
116
78
 
117
79
  def destroy
118
80
 
119
- like = Like.find_by(user_id: current_user.id, room_id: params[:room_id])
81
+ like = Like.find_by(user_id: current_user.id, plan_id: params[:plan_id])
120
82
 
121
83
  like.destroy
122
84
 
123
- @likes = Like.where(room_id: params[:room_id])
85
+ end
124
86
 
87
+
88
+
89
+ private
90
+
91
+ def set_likes
92
+
93
+ @likes = Like.where(plan_id: params[:plan_id])
94
+
125
- end
95
+ end
126
96
 
127
97
  end
128
98
 
@@ -130,80 +100,100 @@
130
100
 
131
101
 
132
102
 
133
- ###/view/rooms/show.html.erb
103
+ ###/view/likes/_like.html.slim
134
104
 
135
105
  ```
136
106
 
107
+ - if current_user.nil?
108
+
109
+ span.heart
110
+
111
+ = image_tag("icon_red_heart.svg")
112
+
113
+ |  
114
+
115
+ = plan.likes_count
116
+
117
+ br
118
+
119
+ - elsif plan.like_user(current_user.id)
120
+
121
+ = button_to plan_like_path([likes, like], plan_id: plan.id), method: :delete, id: "like-button", remote: true do
122
+
123
+ span.heart
124
+
125
+ = image_tag("icon_red_heart.svg")
126
+
127
+ |  
128
+
129
+ = plan.likes_count
130
+
131
+ br
132
+
133
+ - else
134
+
137
- <%= render partial: 'likes/like', locals: { room: @room, likes: @likes } %>
135
+ = button_to plan_likes_path(plan), id: "like-button", remote: true do
136
+
137
+ span.heart
138
+
139
+ = image_tag("icon_heart.svg")
140
+
141
+ |  
142
+
143
+ = plan.likes_count
144
+
145
+ br
138
146
 
139
147
  ```
140
148
 
141
149
 
142
150
 
143
- ###/view/likes/_like.html.erb
151
+ ###/view/likes/create.js.slim
144
152
 
145
153
  ```
146
154
 
147
- <% if user_signed_in? %>
155
+ | $("#like-button").html("
148
156
 
157
+ = j(render partial: 'like', locals: { plans: @plans, likes: @likes, like: @like })
149
158
 
150
-
151
- <% if room.like_user(current_user.id) %>
152
-
153
- <%= button_to room_like_path(likes, room_id: room.id), method: :delete, id: "like-button", remote: true do %>
154
-
155
- <%= image_tag("icon_red_heart.svg") %>
156
-
157
- <span><%= room.likes_count %></span>
158
-
159
- <% end %>
159
+ | ");
160
-
161
-
162
-
163
- <% else %>
164
-
165
- <%= button_to room_likes_path(room), id: "like-button", remote: true do %>
166
-
167
- <%= image_tag("icon_heart.svg") %>
168
-
169
- <span><%= room.likes_count %></span>
170
-
171
- <% end %>
172
-
173
-
174
-
175
- <% end %>
176
-
177
-
178
-
179
- <% else %>
180
-
181
- <%= image_tag("icon_heart.svg") %>
182
-
183
- <span><%= room.likes_count %></span>
184
-
185
-
186
-
187
- <% end %>
188
160
 
189
161
  ```
190
162
 
191
163
 
192
164
 
193
- ###/view/likes/create.js.erb
165
+ ###/view/likes/destroy.js.slim
194
166
 
195
167
  ```
196
168
 
169
+ | $("#like-button").html("
170
+
197
- $("#like-buttons").html("<%= j(render partial: 'like', locals: { room: room, likes: @likes, like: @like}) %>");
171
+ = j(render partial: 'like', locals: { plans: @plans, likes: @likes })
172
+
173
+ | ");
198
174
 
199
175
  ```
200
176
 
201
177
 
202
178
 
203
- ###/view/likes/destroy.js.erb
179
+ ###補足情報
204
180
 
205
- ```
181
+ 本番環境
206
182
 
207
- $("#like-buttons").html("<%= j(render partial: 'likes/like', locals: { posts: @posts, likes: @likes }) %>");
183
+ ・さくらVPS
208
184
 
185
+ ・ubuntu 16.04
186
+
187
+ ・nginx 1.10.3-0
188
+
189
+ ・unicorn 4.9.0-2build2
190
+
191
+ ・ruby 2.4.1p111 (2017-03-22 revision58053) [x86_64-darwin16]
192
+
193
+ ・Rails 5.0.3
194
+
195
+
196
+
209
- ```
197
+ 開発環境
198
+
199
+ ・cloud9

3

エラー内容

2017/08/17 03:15

投稿

japomondo
japomondo

スコア23

test CHANGED
File without changes
test CHANGED
@@ -12,7 +12,7 @@
12
12
 
13
13
  が、原因が分かりませんでした。
14
14
 
15
- 原因が分かる方いらっしゃいましたら、ご教示いただけないでしょうか。
15
+ 分かる方いらっしゃいましたら、ご教示いただけないでしょうか。
16
16
 
17
17
 
18
18
 

2

エラー内容

2017/07/09 10:23

投稿

japomondo
japomondo

スコア23

test CHANGED
File without changes
test CHANGED
@@ -10,7 +10,7 @@
10
10
 
11
11
 
12
12
 
13
- が、該当の箇所が分かりませんでした。
13
+ が、原因が分かりませんでした。
14
14
 
15
15
  原因が分かる方いらっしゃいましたら、ご教示いただけないでしょうか。
16
16
 

1

エラー内容を追記

2017/07/09 10:22

投稿

japomondo
japomondo

スコア23

test CHANGED
File without changes
test CHANGED
@@ -2,7 +2,15 @@
2
2
 
3
3
  RailsとajaxでLike機能を実装したいと思っているのですが、Likeボタンを押しても反応しません。
4
4
 
5
+
6
+
5
- コンソールにエラーが出ていました。
7
+ コンソールに下記のエラーが出ていました。
8
+
9
+ TypeError (no implicit conversion of Fixnum into String):
10
+
11
+
12
+
13
+ が、該当の箇所が分かりませんでした。
6
14
 
7
15
  原因が分かる方いらっしゃいましたら、ご教示いただけないでしょうか。
8
16