How To: Render nested fields inside a table

By default fields_for inside nested_form_for adds <div class="fields"> wrapper around every nested object. But when you need to render nested fields inside a table you can disable default wrapper using :wrapper => false option and use the custom one:

<table>
  <%= f.fields_for :tasks, :wrapper => false do |task_form| %>
    <tr class="fields">
      <td>
        <%= task_form.hidden_field :id %>
        <%= task_form.text_field :name %>
      </td>
      <td><%= task_form.link_to_remove 'Remove' %></td>
    </tr>
  <% end %>
  <tr>
    <td><%= f.link_to_add 'Add', :tasks %></td>
  </tr>
</table>

Note: You need to specify id field. Otherwise fields_for will insert it after </tr>.

Also you need to override default behavior of inserting new subforms into your form using javascript:

window.NestedFormEvents.prototype.insertFields = function(content, assoc, link) {
  var $tr = $(link).closest('tr');
  return $(content).insertBefore($tr);
}

A similar technique can be used for lists, for compatibility with a jQuery UI sortable list.

If you are using simple_form then add the :wrapper => false option to the surrounding simple_nested_form_for call, otherwise it gets overwritten by the :wrapper => nil default.