Last active
June 7, 2019 08:00
-
-
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
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<%= 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 %> |
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
You need to change the first line to:
and likewise in the actions block on the bottom: