demarches-normaliennes/app/javascript/new_design/champs/repetition.js
2020-08-25 15:45:49 +02:00

33 lines
1.1 KiB
JavaScript

import { delegate, fire } from '@utils';
const CHAMP_SELECTOR = '.editable-champ';
const BUTTON_SELECTOR = '.button.remove-row';
const DESTROY_INPUT_SELECTOR = 'input[type=hidden][name*=_destroy]';
const DOM_ID_INPUT_SELECTOR = 'input[type=hidden][name*=deleted_row_dom_ids]';
delegate('click', BUTTON_SELECTOR, (evt) => {
evt.preventDefault();
const row = evt.target.closest('.row');
for (let input of row.querySelectorAll(DESTROY_INPUT_SELECTOR)) {
input.disabled = false;
input.value = true;
}
row.querySelector(DOM_ID_INPUT_SELECTOR).disabled = false;
for (let champ of row.querySelectorAll(CHAMP_SELECTOR)) {
champ.remove();
}
evt.target.remove();
row.classList.remove('row');
// We could debounce the autosave request, so that row removal would be batched
// with the next changes.
// However *adding* a new repetition row isn't debounced (changes are immediately
// effective server-side).
// So, to avoid ordering issues, enqueue an autosave request as soon as the row
// is removed.
fire(row, 'autosave:trigger');
});