如何在 Rails 3 中定位嵌套的表单元素

Question

我正在创建一个 Rails 3 应用程序，它使用具有两级嵌套属性的嵌套表单，即

<%= form_for @workareas do |f| %>
   <%= f.text_field :workarea_name %>
   <%= f.fields_for :projects  do |project| %>
      <%= f.text_field :project_name %>
      <%= f.fields_for :tasks  do |task| %>
         <%= f.text_field :task_name %>   
         <%= f.check_box :complete %>
         <%= f.check_box :urgent %>
         <%= f.check_box :today %>
      <% end %>
   <% end %>
<% end %>

（我意识到这个伪代码不是 100% 有效的）

我正在使用 cocoon 来处理嵌套表单。我使用的是 Ryan 的nested_forms，但因为 Coccon 似乎更能处理这个问题而切换了。

我想在表格中显示任务，例如：

<table class="tasks">
  <tr>
    <th><%= f.label :task_name %></th>
    <th><%= f.label :complete %></th>
    <th><%= f.label :urgent %></th>
    <th><%= f.label :today %></th>
  </tr>
  <%= f.fields_for :tasks do |task| %>  
    <tr>
       <td><%= f.text_field :task_name %></td>
       <td><%= f.check_box :complete %></td>
       <td><%= f.check_box :urgent %></td>
       <td><%= f.check_box :today %></td>
    </tr>
  <% end %>
</table>
<%= link_to_add_association "New Task", f, :tasks %>

我在将新任务插入布局中的正确位置时遇到问题。这是因为会有多个任务表，视图上的每个项目下都有一个。

我意识到我可以使用脚本来指定添加字段的位置：

$(function() {
    $("a.add_fields.").
      data("association-insertion-position", 'after').
      data("association-insertion-node", '.tasks tr:last');
});

但不知道如何传递任务属于哪个项目。例如，如果我有两个项目，并尝试将任务添加到第二个项目，则字段当前正在添加到第一个项目。 （它们在保存时与项目 2 正确关联，但这纯粹是一个布局问题）。

以前有人遇到过这个问题吗？是否有更好的选择器用于“关联插入节点”。我欢迎任何指示或建议。

谢谢！！

更新

我仍然没有找到解决这个问题的方法。基本上我想要做的是将包含在<tr> 块中的嵌套子元素添加到父表单。我无法按照我想要/期望的方式完成这项工作。

作为临时解决方案，我现在在 <li> 块中呈现子元素。 <li> 块包含每个孩子的完整 <table><tbody><tr> 块。这在格式方面不太理想，但我能想到的最好的。

我将暂时保留这个问题，希望有人能提供更好的解决方案。

感谢到目前为止所有回复的人。

Answer 1

不知道你的表格是怎么显示的，我的JS有点生疏，不过你可以像这样在link_to中传递一个data属性：

<%= link_to_add_association "New Task", f, :tasks, 'data-project_id' => "project_#{project.id}" %>

然后在你的函数中：

var project_id = $(this).data("project_id");
$("#" + project_id + " a.add_fields.").

CodeSchool.com 上有一个很好的教程，他们可以在其中使用 jQuery Air：Captain's Log

Answer 2

我没有找到一个简单的方法来解决这个问题。

最后我不得不用一个自定义函数覆盖 cocoon 的 javascript，该函数本质上是构造一个新的关联对象名称，并将新的关联对象附加到现有序列中。

不是一个简单的解决方案。我将与 Cocoon 的开发人员分享它，也许可以更新 gem 以提供此功能。

感谢您的建议。