teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

追加質問への回答

2016/10/25 04:12

投稿

hana-da
hana-da

スコア1728

answer CHANGED
@@ -29,4 +29,55 @@
29
29
 
30
30
  さてここで、あなたが「`#sympathizes_ajax` のリンクを **いいね!を取り消す** に書き換えて!!!」と言われたら、何番目を書き換えますか???
31
31
 
32
- js.erbは **$('#sympathizes_ajax')** となっていて何番目という指定もなく **#sympathizes_ajax** は3つある。という状態なので jQuery さんは困ってしまって、何も仕事しないのも悪いし。。と。。。くるしまぎれに一番最初を書き換えてるんじゃないかなぁと思います。
32
+ js.erbは **$('#sympathizes_ajax')** となっていて何番目という指定もなく **#sympathizes_ajax** は3つある。という状態なので jQuery さんは困ってしまって、何も仕事しないのも悪いし。。と。。。くるしまぎれに一番最初を書き換えてるんじゃないかなぁと思います。
33
+
34
+ ----
35
+
36
+ コメント欄が違う方向で盛り上ってますねww
37
+
38
+ > では、hana-daさんが指摘してくださった問題を解決するためには
39
+ > idを指定した配列では不可能ということでしょうか?
40
+ >
41
+ > 何か対策を取りたいです。
42
+ > ・idにランダムな文字列を返す変数を代入する
43
+ > 以外に思いつかないのですが、おそらくidの値を変えたとしても問題は解決されないですよね。。。
44
+
45
+ (なんか色々、用語の使い方がおかしいような気もしますが。。。そこはスルーして。。。)
46
+
47
+ **id属性**の値をちゃんと一意なものにしてあげて、それをjavascriptで操作対象にしてあげればいいと思います。
48
+
49
+ ちょっと時間がないので検証してないコードを書いちゃいますが
50
+
51
+ まず **micropost.html.erb** で
52
+
53
+ ```erb
54
+ <% if shop_signed_in? %>
55
+ <div id="sympathizes_ajax_<%= micropost.id %>">
56
+ <%= render 'sympathizes/sympathize_links', micropost: micropost %>
57
+ </div>
58
+ <% end %>
59
+ ```
60
+
61
+ **id属性**の値に `micropost.id` をつけてあげる事で一意にする。
62
+
63
+ 次 **sympathizes/_sympathize_links.html.erb**
64
+
65
+ ```erb
66
+ <% if micropost.sympathized_by? current_shop %>
67
+ <%= link_to 'いいね!を取り消す', micropost_sympathizes_path(micropost.id), method: :delete, remote: true %>
68
+ <% else %>
69
+ <%= link_to 'いいね!', micropost_sympathizes_path(micropost.id), method: :post, remote: true %>
70
+ <% end %>
71
+ ```
72
+
73
+ ここでは、ちゃんと `micropost.id` を送信しているので問題なし
74
+
75
+ 次 **sympathizes/xxx.js.erb***
76
+
77
+ ```javascript
78
+ $('#sympathizes_ajax_<%= @micropost.id %>').html.........
79
+ ```
80
+
81
+ 操作対象を **micropost.html.erb** の変更に合せてあげる。
82
+
83
+ で、どうですかね?