Question

I am creating a Rails 3 app that makes use of a nested form with two levels of nested attributes, i.e.

<%= 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 %>

(I realize this pseudocode is not 100% valid)

I’m using cocoon to handle nested forms. I was using Ryan’s nested_forms, but switched as Coccon seemed better able to deal with this issue.

I would like to display the tasks within a table, something like:

<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 %>

I’m running into problems inserting new tasks into the correct location in the layout. This is because there will be multiple task tables, one under each project on the view.

I realize I can use a script to specify the position where fields are added:

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

But can’t figure out how to pass in which project the tasks belong to. For example, if I have two projects, and try to add tasks to the 2nd project, the fields are currently being added to the 1st project. (They are correctly associated with project 2 on save however, this is purely a layout issue).

Has anyone run into this issue before? Is there a better selector to use for the “association-insertion-node”. I’d welcome any pointers or suggestions.

Thanks!!

UPDATE

I still haven’t managed to find a solution to this. Essentially what I want to do is add nested child elements, contained within a <tr> block, to a parent form. I have not been able to make this work the way I would like/ expect.

As an interim solution, I am now rendering the child elements within a <li> block. The <li> block contains a complete <table><tbody><tr> block for each child. This is less than ideal in terms of formatting, but the best I’be been able to come up with.

I’m going to leave this question open, for the time being at least, in the hopes that someone can provide a better solution.

Thanks to everyone that has replied so far.

Answer 1

I didn’t find an easy way to solve this.

In the end I had to over ride cocoon’s javascript with a custom function that essentially constructs a new association object name, and appends the new association object to the existing sequence.

Not an easy solution. I will share it with Cocoon’s developer and maybe the gem can be updated to offer this functionality.

Thanks for the suggestions.