Rails将局部变换为循环中的局部并访问它们

时间:2016-06-28 09:31:08

标签: ruby-on-rails ruby twitter-bootstrap

您好我想制作一个游戏应用程序,用户可以参与游戏并创建团队。 这是我的代码 在games_controller.rb中

def team_events
  @doubles = Game.where(game_type: Game::DOUBLES)
  @mixed_doubles = Game.where(game_type: Game::MIXED_DOUBLES)
  @others = Game.where(game_type: Game::OTHERS)
end

我的team_events.html.erb中的代码:

<div class = "container-fluid">
  <div class = "row">
    <%= render partial: "shared/table", locals: {doubles_games: @doubles} %>
  </div>
</div>

在下面的部分中,我在每个游戏旁边显示一个“创建团队”链接。当用户单击它时,将打开一个模式对话框,其中包含用于创建团队的表单。 enter image description here

_table.html.erb partial中的代码

<table class = "table table-hover">

  <thead>
    <tr>
      <th> Game </th>
      <th> Game Type </th>
      <th> Actions </th>
   </tr>
  </thead>

  <tbody>
    <% doubles_games.each do |game| %>
      <tr>
        <td><%= game.name %></td>
        <td><%= game.game_type %></td>
        <td>
          <a href="#" type="button" data-toggle="modal" data-target="#myModal">
          Create Team
          </a>
        </td>
      </tr>
    <% end %>
  </tbody>

</table>

bootstrap模态窗口

<div class="modal fade" id="myModal" role="dialog">
  <div class="modal-dialog">
    <div class= "modal-content">

      <div class="modal-body">
        <%= render partial: 'teams/form', locals: {game: game} %>
      </div>

    </div>
  </div>
</div>

_form.html.erb中的代码

<%= simple_form_for Team.new, url: teams_path(game_id: game.id), method: :post do |f| %>
  <%= f.input :game_name, label: "Game", input_html: {value: "#{game.name}"}, disabled: true %>
  <%= f.input :game_type, label: "Type", input_html: {value: "#{game.game_type}"}, disabled: true %>
  <%= f.input :name, autofocus: true, required: false, hint: "Name your team" %>
  <%= f.input :members, as: :text, required: true, hint: "Enter the names seperated by comma" %>
  <%= f.submit "Create", class: "btn btn-success" %>
<% end %>

当用户点击游戏旁边的“创建团队”链接时,将打开模态窗口,并显示创建团队的表单。同样在模态窗口中,用户创建团队的游戏也会出现(选中已禁用:_form.html.erb中的true选项)。 所以当我点击创建乒乓球队时。出现以下窗口

enter image description here

这里的问题是用户点击创建团队链接的任何游戏,它显示相同的游戏。 所以,如果我点击创建羽毛球或卡罗姆队。在窗口中它只显示乒乓球 如果您需要更多详细信息,请与我们联系

2 个答案:

答案 0 :(得分:0)

在以下行中,您使用的是两个冒号,而不是一个冒号:

<%= render partial: "shared/table", locals: {:doubles_games: @doubles} %>

正确的代码应该是:

<%= render partial: "shared/table", locals: { doubles_games: @doubles } %>

答案 1 :(得分:0)

所有游戏都有id'myModal'和data-target =“#myModal”。所以它打开了第一个带有'myModal'的模态。 ID必须在文档中是唯一的。因此,尝试为每个模态使用不同的ID来解决此问题。

你有很多形式(内部循环),所以你可以从javascript触发一个模态并传递游戏类型或id以避免更多的html内容。