Question

我有一个有X行的表。我使用迭代器迭代集合中的每个对象并将其渲染成一行。

每个对象/行也与它自己的形式相关联。

但是我想立即保存整个集合，并在用户点击1提交按钮时更新所有子表单，而不是每个表单实例1更新。

这是代码的示例：

<% @port_stocks.each do |port_stock| %>
          <tr>
            <td><%= number_to_currency(port_stock.purchase_price) %></td>
            <td><%= port_stock.volume %></td>
            <td>
              <% cp = ClosedPosition.new %>
              <%= simple_form_for cp, url: port_stocks_sell_order_path, method: :post, html: { class: "form-inline" } do |f| %>
                <div class="form-group">
                  <%= f.input_field :num_units, id: "sell-ps-#{port_stock.id}", class: "form-control mx-sm-3" %>
                </div>
                <%= f.submit "Save", class: "btn btn-primary" %>
              <% end %>
            </td>
          </tr>
<% end %>

如果port_stock集合中有3个@port_stocks个对象，则上面的表单会呈现3个提交按钮 - 这正是我不想要的。

我只想要一个提交按钮，为集合中的每个cp对象提交port_stock相关信息。

Answer 1

您可以隐藏simple_form中的提交按钮，如下所示：

<% @port_stocks.each do |port_stock| %>
  <tr>
    <td><%= number_to_currency(port_stock.purchase_price) %></td>
    <td><%= port_stock.volume %></td>
    <td>
      <% cp = ClosedPosition.new %>
      <%= simple_form_for cp, url: port_stocks_sell_order_path, method: :post, html: {class: "form-inline"} do |f| %>
        <div class="form-group">
          <%= f.input_field :num_units, id: "sell-ps-#{port_stock.id}", class: "form-control mx-sm-3" %>
        </div>
        <%= f.submit "", class: "click-me", style: "display: none;" %>
      <% end %>
    </td>
  </tr>
<% end %>

然后在循环外面有一个按钮，如下所示：

<button type="button" class='btn btn-primary' onclick="submit()">Submit!</button>

点击此按钮，使用JS触发隐藏提交按钮的点击。

<script>
    function submit(){
      var el = document.getElementsByClassName('click-me');
      for (var i=0;i<el.length; i++) {
        el[i].click();
      }
    }
</script>

Answer 2

只是一个想法，跟进我的评论，使用标准表单助手。用表格包裹表格：

<%= form_for :closed_position, url: {action: :port_stocks_sell_order_path, method: :post} do |form|%>
  <table>
      <% @port_stocks.each do |port_stock| %>
        <tbody>
            <tr>
              <td><%= port_stock.volume %></td>
              <td><%= port_stock.purchase_price %></td>
              <td>
                  Num: <%= form.text_field "port_stock_id[#{port_stock.id}][num_units]" %>
              </td>
            </tr>
        </tbody>
      <% end %>
  </table>
  <%= form.submit "save" %>
<% end %>

参数应该类似于：

{"utf8"=>"✓", "authenticity_token"=>"blahblah", "closed_position"=>{"port_stock_id"=>{"1"=>{"num_units"=>"999"}, "2"=>{"num_units"=>"888"}}}, "commit"=>"save", "method"=>"post", "controller"=>"port_stocks", "action"=>"port_stocks_sell_order_path"}

然后设法将每个ClosedPosition保存在控制器中。

如何使用1个提交按钮提交3个表单？

2 个答案: