96037069ff
Before, when autosaving a draft, removing a repetition row would send `_destroy` inputs to the controller – but not remove the row from the DOM. This led to the `_destroy` inputs being sent again on the next autosave request, which made the controller raise (because the row fields were already deleted before). To fix this, we let the controller response remove the deleted row(s) from the DOM. Doing it using a controller response avoids the need to keep track of operations on the Javascript side: the controller can easily know which row was just deleted, and emit the relevant changes for the DOM. This keeps the autosave requests robust: even if a request is skipped (e.g. because of a network interruption), the next request will still contain the relevant informations to succeed, and not let the form in an unstable state. Fix #5470
27 lines
1.2 KiB
Text
27 lines
1.2 KiB
Text
%div{ class: "repetition-#{form.index}" }
|
||
- champ.rows.each do |champs|
|
||
- row_dom_id = "row-#{SecureRandom.hex(4)}"
|
||
%div{ class: "row row-#{champs.first.row}", id: row_dom_id }
|
||
-# Tell the controller which DOM element should be removed once the row deletion is successful
|
||
= hidden_field_tag 'deleted_row_dom_ids[]', row_dom_id, disabled: true
|
||
|
||
- champs.each do |champ|
|
||
= form.fields_for :champs, champ do |form|
|
||
= render partial: 'shared/dossiers/editable_champs/editable_champ', locals: { champ: form.object, form: form }
|
||
= form.hidden_field :_destroy, disabled: true
|
||
.flex.row-reverse
|
||
- if champ.persisted?
|
||
%button.button.danger.remove-row{ type: :button }
|
||
Supprimer l’élément
|
||
- else
|
||
%button.button.danger{ type: :button }
|
||
Supprimer l’élément
|
||
|
||
- if champ.persisted?
|
||
= link_to champs_repetition_path(form.index), class: 'button add-row', data: { remote: true, method: 'POST', params: { champ_id: champ&.id }.to_query } do
|
||
%span.icon.add
|
||
Ajouter un élément pour « #{champ.libelle} »
|
||
- else
|
||
%a.button.add-row
|
||
%span.icon.add
|
||
Ajouter un élément pour « #{champ.libelle} »
|