Skip to content

Instantly share code, notes, and snippets.

@seanlinsley
Last active June 7, 2019 08:00
Show Gist options
  • Star 7 You must be signed in to star a gist
  • Fork 4 You must be signed in to fork a gist
  • Save seanlinsley/2038003 to your computer and use it in GitHub Desktop.
Save seanlinsley/2038003 to your computer and use it in GitHub Desktop.
A better form to edit multiple child records. Created for https://github.com/gregbell/active_admin/issues/1097
<%= semantic_form_for @parent do |a| %>
<%= a.inputs "Family Details" do %>
<%= a.input :name %>
<%= a.input :user %>
<%= a.input :region %>
<% end %>
<%= a.inputs "Children" do %>
<table>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Age</th>
<th>Gender</th>
</tr>
<%= a.semantic_fields_for :children do |b| %>
<tr>
<td><%= b.input :first_name, :label => false %></td>
<td><%= b.input :last_name, :label => false %></td>
<td><%= b.input :age, :label => false %></td>
<td><%= b.input :gender, :label => false %></td>
<td><%= link_to "Remove", "#", onclick: "
if (confirm('Are you sure you want to delete this?\
\\nIt will be permanently deleted!')) {
$.ajax({url: '/children/#{b.object.id}', type: 'DELETE'});
$(this).closest('tr').remove(); return false;
}", :class => "button" %></td>
</tr>
<% end %>
<% js = a.semantic_fields_for :children, Child.new do |c| %>
<tr>
<td><%= c.input :first_name, :label => false %></td>
<td><%= c.input :last_name, :label => false %></td>
<td><%= c.input :age, :label => false %></td>
<td><%= c.input :gender, :label => false %></td>
<td><%= link_to "Remove", "#", :onclick => "$(this).closest('tr').remove(); return false;", :class => "button" %></td>
</tr>
<% end %>
</table>
<span class="add-child">
<% js = escape_javascript(js) %>
<%= link_to I18n.t('active_admin.has_many_new',
model: @child.to_s.singularize.titlecase), "#",
onclick: "$('table.children tr').last().after(
'#{js}'.replace(/[0-9]+(?=[\\\]_])/g, new Date().getTime())
); return false;",
class: "button" %>
</span>
<% end %>
<%= a.actions do %>
<%= a.action :submit %>
<li class="cancel"><%= link_to "Cancel", parent %></li>
<% end %>
<% end %>
@kstec
Copy link

kstec commented Jul 30, 2012

A bit confused on this usage. What is the @parent instance variable? How and where is that defined?

@seanlinsley
Copy link
Author

Parent and child/children are fake models, for the sake of having something there. Any reference to these should be replaced with your model names.

So if parent = country, then child/children = city/cities

@kstec
Copy link

kstec commented Jul 30, 2012 via email

@seanlinsley
Copy link
Author

That's because the _path helpers are only available in the controller. Try link_to "Stuff", @test_case

@inscapist
Copy link

it makes the form a lot better! thumb up Daxter!

@troelskn
Copy link

troelskn commented Jan 3, 2013

You need to change the first line to:

<%= semantic_form_for [:admin, @parent] do |a| %>

and likewise in the actions block on the bottom:

<li class="cancel"><%= link_to "Cancel", [:admin, @parent] %></li>

@loicginoux
Copy link

thanks for this, it's a lot nicer. I found another thing for me to make it working.
It didn't do anything when clicking on "add a new child". just add a class to the table:

 <%= a.inputs "Children" do %>
    <table class="children">
      <tr>

so that it get found when calling in javascipt here:

<%= link_to I18n.t('active_admin.has_many_new',
          model: @child.to_s.singularize.titlecase), "#",
          onclick: "$('table.children tr').last().after(
                      '#{js}'.replace(/[0-9]+(?=[\\\]_])/g, new Date().getTime())
                    ); return false;",
          class: "button" %>
    </span>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment