4

Ruby on Rails を始めたばかりで、ブートストラップのモーダルの使用について質問があります。したがって、私の問題は、テーブルがあり、このテーブルの各行に対して、依存クラスに関する他の情報をモーダルで表示するボタンを作成しますが、最初の行にのみ正しい情報を表示し、他のすべての行に同じ情報を表示することです. 私はそれを動的にし、それが扱うオブジェクトに対応させたいと思っています。

      <table class="table table-hover table-condensed">
          <tr>
            <th>Id</th>
            <th>Name</th>
            <th>Description</th>
            <th>Priority</th>
            <th>State</th>
            <th></th>
            <th></th>
          </tr>

        <% @user_stories.each do |user_story| %>
          <tr>
            <td><%= user_story.id %></td>
            <td><%= user_story.name %></td>
            <td><%= user_story.description %></td>
            <td><%= user_story.priority %></td>
            <td><%= user_story.state %></td>

            <td>
                    <div class="btn-group">
                        <a class="btn btn-primary">Options</a>
                        <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><%= link_to 'Show', user_story %></li>
                            <li class="divider"></li>
                            <li><%= link_to 'Edit', edit_user_story_path(user_story) %></li>
                            <li class="divider"></li>
                            <li> <%= link_to 'Destroy', user_story, :confirm => 'Are you sure?', :method => :delete %></li>
                        </ul>
                    </div>
            </td>
            <td> <a href="#myModal" role="button" class="btn" data-toggle="modal">Global View</a></td>
            <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h3 id="myModalLabel">Golbal view : <%= user_story.name %></h3>
              </div>
              <div class="modal-body">
                        <% us = user_story.functionalities %>
                        <% us.each do |f| %>
                        <span class="label label-info"><%= f.name %></span>
                        <% t = f.tasks%>
                        <br/>
                            <% t.each do |y| %>
                            <%= y.name %>
                            <% u = User.where(:id => y.user_id) %>
                            <%= u.collect {|p|  ": #{p.first_name} #{p.last_name}"} %>
                            <br/>
                            <% end %>
                        <br/>
                        <% end %>
              </div>
              <div class="modal-footer">
                <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>

              </div>
            </div>
          </tr>
        <% end %>
        </table>

それを修正する方法はありますか？

ルート:

Backlog::Application.routes.draw do
    resources :functionalities

    resources :user_stories

    resources :users

    resources :tasks
end
4

1 に答える 1

7

すべての行にモーダルを追加しました。

<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

しかし、ここではすべての行でモーダルのIDは同じです。したがって、すべての行で同じダイアログが表示されます。モーダルの動的IDを作成する必要があり、モーダルdivでIDを使用している場所はどこでも。

<a href="#myModal<%= user_story.id%>" role="button" class="btn" data-toggle="modal">Global View</a>
<div id="myModal<%= user_story.id%>" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h3 id="myModalLabel<%= user_story.id%>">Golbal view : <%= user_story.name %></h3>
              </div>
              <div class="modal-body">
                        <% us = user_story.functionalities %>
                        <% us.each do |f| %>
                        <span class="label label-info"><%= f.name %></span>
                        <% t = f.tasks%>
                        <br/>
                            <% t.each do |y| %>
                            <%= y.name %>
                            <% u = User.where(:id => y.user_id) %>
                            <%= u.collect {|p|  ": #{p.first_name} #{p.last_name}"} %>
                            <br/>
                            <% end %>
                        <br/>
                        <% end %>
              </div>
              <div class="modal-footer">
                <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>

              </div>
            </div>
于 2013-07-04T12:16:36.293 に答える