Reputation: 2693
I have a simple_form with remote: true
. I'm adding nested fields to it (people for this example) with cocoon.
<%= simple_form_for @incorporation, html: {id:"incorporationform"}, remote: true, update: { success: "response", failure: "error"} do |f| %>
<%= f.simple_fields_for :company do |company| %>
<div id="people" class="form_section">
<div class="form-right">
<div id="dynamic-person" class="dynamic-entity level1 person entityAttributes">
<%= company.simple_fields_for :people do |person|%>
<%= render 'person_fields', f: person %>
<% end %>
<div><%= link_to_add_association 'Add Person', company, :people, class: "btn btn-default add-button" %></div>
</div>
</div>
</div>
This all works very well except under a particular circumstance. If I'm editing a form that's previously been saved to the database with a few people on it, I cannot perform the following sequence of activities:
link_to_remove_association
remote: true
)Everything works until I try to perform that second save, at which point I'm confronted with the following error:
19:19:38 web.1 | ActiveRecord::RecordNotFound (Couldn't find Person with ID=33 for Company with ID=1):
The Person with ID=33
refers to the person I removed in step 1. When I check the people
table, in my database. Person 33
is indeed gone (indicating that my save in step 2 was good). My interpretation of what's going on is that after saving the removal, the remote form forgets that Person 33
is gone and goes looking for him on the next save.
To be absolutely clear, there is no issue if remote: false
OR if I refresh the page between steps 2 & 3.
Anyone have a guess at a solution for this? Many thanks in advance to anyone who gives it a shot.
Edit
Upon further research, it appears that cocoon is really not built to handle ajax submissions. However it seems that this can be gotten around by replacing elements in the dom asynchronously. The comment only provides a summary of the process used. I'm guessing that they did something like <%= escape_javascript(render(:partial => _person_fields.html.erb)) %>
However I'm unfamiliar asynchronous rendering of partials. I imagine that I would have to remove the current partial from the dom and then load a new version of it. Is this the right idea? If so, what's the best way to remove the old partial, just straight jquery?
Upvotes: 1
Views: 284