同じオブジェクトを開くモーダルの問題

Question

私は古いRails 3.2.22アプリケーションを維持していますが、モーダルを追加してシンプルなフォームでポップアップしてメモを追加しようとしています。ここで

は、私の見解（読みやすくするために切り倒さ）

ここ

<% @assigned.each do |call| %> 
      <%= link_to "Notes", '#ajax-modal', data: { toggle: "modal", target: "#note-modal" }, class: 'btn btn-small btn-inverse' %> 
     <%= render 'layouts/note_modal', :call => call %> 
<% end %> 

がある私のモーダルアプリ/ビュー/レイアウト/ _note_modal.html.erb

<div id="note-modal" class="modal hide fade" tabindex="-1"> 
     <div class='modal-header'> 
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h3 class="modal-title"><%= call.incident_number %> Notes</h3> 
     </div> 
     <div class='modal-body'> 
     <div class="modal-body-content">  

    <%= form_for(@note, url: call_note_calls_path, html: {class: "form-inline"}) do |f| %> 
        <%= f.text_field :message, :maxlength => 255 %> 
        <%= f.hidden_field :call_id, value: call.id %> 
        <%= f.hidden_field :user_id, value: current_user.id %> 
        <%= f.button "Add Note", class: 'btn btn-info btn-small', data: {disable_with: "<i class='icon-spinner'></i>Posting..."} %> 
        <% end %></div> 
    <div class="ajax-loader"> 
    </div> 
    </div> 
    <div class='modal-footer'> 
    <button type="button" data-dismiss="modal" class="btn">Close</button> 
    </div> 
</div> 

私はページをロードすると、そこにあります私はノートリンクをクリックするいくつかの呼び出しです、部分的にモーダルでレンダリングし、私はメモを提出することができます。問題は、どのノートリンクをクリックしても画面上で10回の呼び出しがあっても、画面上の最初の呼び出しにメモが追加された場合です。

地元を間違って渡していますか？私はこのコードがブロックの内側にあるので、呼び出しオブジェクトを引っ張ってモーダルで部分的にローカルに渡すべきだが、そうではない。

ご協力いただきまして誠にありがとうございます。

Answer 1

私は、メモのたびにモーダルをレンダリングすることが問題だと思いますが、それらはすべて同じIDを持っています。あなたは常に最初のモーダルを開いています。実際には、モーダルをに一度レンダリングし、モーダルをトリガーするリンク上のデータ属性を介してnote_idを渡すだけです。基本的には、呼び出し元を介してモーダルを設定します。

Answer 2

私はこれを自分で調べることができましたが、ループの中で部分的にモーダルのターゲットIDの一部としてインデックスを呼び出してレンダリングしました。以下の作業コード。

<% @assigned.each_with_index do |call, index| %> 
    <%= link_to "Notes", '#note-modal', data: {toggle: "modal", target: "#note-modal#{index}" }, class: 'btn btn-small btn-inverse' %> 
    <%= render 'layouts/note_modal', call: call, index: index %> 
<% end %> 

<div id="note-modal<%= index %>" class="modal hide fade" tabindex="-1"> 
    <div class='modal-header'> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
    <h3 class="modal-title"><%= call.incident_number %> Notes</h3> 
    </div> 
    <div class='modal-body'> 
    <div class="modal-body-content"> 
     <%= form_for(@note, url: call_note_calls_path, html: {class: "form-inline"}) do |f| %> 
       <%= f.text_field :message, :maxlength => 255 %> 
       <%= f.hidden_field :call_id, value: call.id %> 
       <%= f.hidden_field :user_id, value: current_user.id %> 
       <%= f.button "Add Note", class: 'btn btn-info btn-small', data: {disable_with: "<i class='icon-spinner'></i>Posting..."} %> 
       <% end %></div> 
    <% call.notes.each do |n| %> 
    <li><%= n.message %> added by <%= n.user.username %></li> 
    <% end %> 
    <div class="ajax-loader"> 
    </div> 
    </div> 
    <div class='modal-footer'> 
    <button type="button" data-dismiss="modal" class="btn">Close</button> 
    </div> 
</div>