私のアプリケーションのホームページでは、テニスプレーヤーのコレクション(@atp_ranks
)を繰り返し、各テニスプレーヤーについて、自分の属性と現在のユーザーが参加できるようにするボタンを使ってテーブル行を作成しますそのテニス選手:コントローラーがAjaxに応答しない
<table>
<thead>
<tr>
<th> Rank </th>
<th> Player </th>
<th> Points </th>
<th id="atp_count" class="tennis_stats"> <%= current_user.atp_ranks.count %> selected </th>
</tr>
</thead>
<tbody>
<% @atp_ranks.each do |tennis_player| %>
<tr id="tennist-<%= tennis_player.ranking %>">
<td class="atpranking"> <%= tennis_player.ranking %> </td>
<td class="atpname"> <%= tennis_player.name %> </td>
<td class="atppoints"> <%= tennis_player.points %> </td>
<% unless Time.now.month == 12 %>
<td>
<div id="atpenlist_form_<%= tennis_player.id %>">
<% if current_user.atpenlisted?(tennis_player) %>
<%= form_for(current_user.atp_selections.find_by(atp_rank_id: tennis_player.id), html: { method: :delete }, remote: true) do |f| %>
<%= f.submit "Dump", class: "btn btn-warning btn-sm" %>
<% end %>
<% else %>
<%= form_for(current_user.atp_selections.build, remote: true) do |f| %>
<div><%= hidden_field_tag :atp_id, tennis_player.id %></div>
<%= f.submit "Choose", class: "btn btn-primary btn-sm" %>
<% end %>
<% end %>
</div>
</td>
<% end %>
</tr>
<% end %>
</tbody>
</table>
ユーザーがすぐにフォームを送信した結果を見る機会を与えるために、私は、各フォームでremote: true
を追加し、app/views/atp_selections
でパーシャルとしてこれらのフォームを保存しました。
次に、上記のディレクトリにcreate.js.erb
とdestroy.js.erb
というファイルを作成しました。
$("#atp_count").html('<%= current_user.atp_ranks.count %> selected');
$("#atpenlist_form_<%= @tennist.id %>").html("<%= escape_javascript(render('atp_selections/atpdiscard')) %>");
jQueryのコードはatp_count
idと第四th
タグのID、およびボタンのフォームを含むdiv
のIDですatpenlist_form_<%= @tennist.id %>
IDを、操作する必要があります。以下はcreate.js.erb
ファイルの内容です。以下は
完全にそれを報告するには長すぎる私のatp_selections
コントローラの抽出物である:あなたが見ることができるように、atp_selections
コントローラの作成アクションが複数で構成されて
def create
@tennist = AtpRank.find(params[:atp_id])
rankings = current_user.atp_ranks.pluck(:ranking)
atp_selections = current_user.atp_selections
wta_selections = current_user.wta_selections
if atp_selections.count <= 15 && wta_selections.count < 16
if (1..5).include?(@tennist.ranking) && (rankings & (1..5).to_a).size == 0
current_user.atpenlist(@tennist)
respond_to do |format|
format.html { redirect_to root_url }
format.js
end
elsif (6..15).include?(@tennist.ranking) && (rankings & (6..15).to_a).size < 3
current_user.atpenlist(@tennist)
respond_to do |format|
format.html { redirect_to root_url }
format.js
end
...
のif-elseステートメントこと募集規則に応えます。しかし、ここで重要なことは、各条件で、Ajaxで処理されるリクエストのために、respond_to
メソッドで必要なコードを含めることでした。
コントローラはAjaxに応答せず、atp_count
とatpenlist_form_<%= @tennist.id %>
への変更はページの更新後にのみ表示されます。
レールコンソールには、次のエラーを報告します。
Rendered atp_selections/create.js.erb (223.6ms)
Completed 500 Internal Server Error in 695ms (ActiveRecord: 83.2ms)
ActionView::Template::Error (undefined local variable or method `tennis_player' for #<#<Class:0x00000005948748>:0x0000000593f648>):
1: <%= form_for(current_user.atp_selections.find_by(atp_rank_id: tennis_player.id),
2: html: { method: :delete }, remote: true) do |f| %>
3: <%= f.submit "Dump", class: "btn btn-warning btn-sm" %>
4: <% end %>
app/views/atp_selections/_atpdiscard.html.erb:1:in `_app_views_atp_selections__atpdiscard_html_erb__451019467450256030_46643760'
app/views/atp_selections/create.js.erb:2:in `_app_views_atp_selections_create_js_erb__4477173780394533370_46811020'
は、反復の変数であり、それは、レンダリング部分からインポートされたとき、それは受け入れられていないかのように思えます。
通常、これはページ内の**ので** jsのコードエラーの発生します。 'create.js.erb'をレンダリングする場合は、単にrails server consoleをチェックインしてください。ブラウザのデバッグツールを開いて、「ネットワーク」タブに行き、そこでリクエスト/レスポンスサイクルを確認してください。 – sahil
元のメッセージにサーバーコンソールによって報告されたものを追加しました。部分的にレンダリングされたフォームに挿入されたときの反復 'tennis_player'の変数は認識されません。 – Asarluhi
あなたは、あなたの部分の中に** tennis_player **として** @ tennist **を渡す必要があります: '$("#atpenlist_form _ <%= @ tennist.id%> ")html(" <%= j render 'atp_selections/atpdiscard '、地元:{tennis_player:@tennist}%> ");' – sahil