Question

我有费用和供应商模型。

在费用表单中，我正在尝试添加New Vendor按钮。

费用模型有：

belongs_to :vendor
accepts_nested_attributes_for :vendor

费用表格有：

<%= simple_form_for @expense, :html => {:class => 'form-horizontal'} do |f| %>

...

    <a data-toggle="modal" href="#vendorform">
      <p class="pull-right btn btn-primary btn-mini">New Vendor</p>
      <div id="vendorform" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="vendorformLabel" aria-hidden="true">
        <%= f.fields_for :vendor do |ff| %>
        <div class="modal-header">
          <a class="close" data-dismiss="modal">&#215;</a>
          <h4 id="vendorformLabel">Add Vendor</h4>
        </div>
        <div class="modal-body">
            <%= ff.input :vendor_name %>
            <%= ff.input :address1 %>
            <%= ff.input :address2 %>
            <%= ff.input :city %>
            <%= ff.input :state %>
            <%= ff.input :zipcode %>
        </div>
        <div class="modal-footer">
          <%= ff.submit 'Save Vendor', :class => 'btn btn-mini btn-primary' %>
          <a class="btn btn-mini" data-dismiss="modal" href="#">Close</a>
        </div>
        <% end %>
      </div>
    </a>

...

当您点击New Vendor按钮时，模态会打开，但它是空白的。

谢谢你的帮助！

UPDATE1

我已将@expense.build_vendor添加到费用控制器New部分。

现在，模态表格中的字段显示出来。

但是，当我提交时，它不会创建新的供应商。相反，看起来模态上的提交按钮提交了费用表单，而不是模态供应商表单。

Answer 1

如果没有关联对象，则不会渲染嵌套字段 - 您需要在控制器中构建它：

@expense.build_vendor

为belongs_to关联创建嵌套字段也很不寻常 - 您是否考虑将密钥从Expense模型移动到Vendor（假设它是1-1关联）？

更新：

你可能想要做的是研究bootstrap模态远程选项（doc here）。我将创建vendor_controller，其中包含两个操作，new和create，其中“new”为远程表单。然后你可以将你的模态指向new动作，它会照顾模态体。（请注意，您的模态必须在表单之外，否则提交按钮将同时提交两个表单）

当您提交远程表单时，将触发创建操作。您可以编写它，以便返回包含供应商名称和ID的json对象。然后，您可以在bootstrap内的远程表单上捕获javascript事件'ajax：success'，并在成功提供供应商表单的过程中为您的供应商选择添加选项。

希望它有意义，这里有很多事情要做，但它是一个非常好的用户体验。

Answer 2

BroiSatse回答了我的问题 - 谢谢！

但是，在考虑之后，我决定只使用jquery（coffeescript）。我只是快速添加了供应商名称，然后将其选中。

以下是代码：

$('.add_vendor').click ->
  vendorname = $("#vendor").val()
  $.ajax
    type: "POST"
    url: "/vendors/"
    data:
      vendor:
        vendor_name: vendorname
    dataType: "json"

    success: (data) ->
      newOption = $('<option value="'+data.id+'" selected="selected">'+vendorname+'</option>')
      $('#expense_vendor_id').append(newOption)
      $('#vendor').val("")
      return false

    error:(data) ->
      return false

Rails嵌套字段用于不显示字段

2 个答案: