When using acf.add_action(‘remove’) found it does fire on removing a row, but it also fires on adding a row. Which make it difficult to isolate an actual row removal. The row being passed as the “removed row” is actually the row that was just added.
Hi @goldhat
You should be able to check the object if it’s cloned or not (prevObject). It should be something like this:
function my_acf_remove_test() {
?>
<script type="text/javascript">
(function($){
// only do this after the assets are fully loaded
acf.add_action('remove', function( $el ){
// $el will be equivalent to the new element being removed $('tr.row')
// Check if the row is added or removed
if( !$el.prevObject.hasClass( "acf-clone" ) ){
// the row is removed
console.log("removed");
} else {
// the row is added
console.log("added");
}
});
})(jQuery);
</script>
<?php
}
add_action('acf/input/admin_footer', 'my_acf_remove_test');
I hope this helps 🙂
Hi,
I’m also having this issue when using the remove action to detect a removal of a flexible content layout. So I implemented James’ prevObject workaround, which did the job until I used an acf image field of a layout.
When selecting an image in the media library, the remove action gets triggered, too (had a look in acf-input.js: it’s the dispose method of the wp.media.view.AttachmentCompat object).
But this time I’m getting an error message saying that I can’t use the hasClass method on undefined. That’s because $el in this context is a form element and has no prevObject property.
Now as a workaround for my case I’m also checking if remove was triggered when a layout was removed:
if ( ! $el.hasClass('layout') || $el.prevObject.hasClass( "acf-clone" ) ){
return false;
}
