CollectionField: Add item and remove buttons do not work in EasyAdmin 4 CRUD update

[MirkoV1987]

Describe the bug I want to update an item in EasyAdmin 4. When i want to add another item to a collection from an ea-edit page, add item button and remove button (the rubbish icon) do not work. Impossible to add another field to collection. Browser console is empty, no error is displayed.

To Reproduce

• Framework: Symfony 6.4
• EasyAdmin version : 4.10

Example:

• I have a Guide entity in my back-office with a CollectionType field.
• One guide can belong to Many categories
• I create a new Guide and can add to collection (or remove) several categories related to the guide. Both buttons run => OK
• BUG : I want to update the previous Guide and want to add more categories or removed one (or more) current categories from collection. Add item button and remove icon button do not work => KO

(OPTIONAL) Additional context

• This bug occurs from EasyAdmin 4.
• All is OK in previous versions : i tested until EasyAdmin 3.5 version
• I have inquired the field-collection.js file, maybe there is an error in this script.

[lukasz-solecki]

I've had same problem several times, since few months. It occurs when embedded forms are used, like CollectionField of sub-forms, or ArrayField. And it's not only field-collection.js, but also other scripts, like field-text-editor.js.

The solution that worked for me is to load needed JS asset manually at upper-level controller. For example:

SiteCrudController:

yield AssociationField::new('settings')
    ->hideOnIndex()
    ->renderAsEmbeddedForm(SettingsCrudController::class)
    ->addJsFiles(Asset::fromEasyAdminAssetPackage('field-collection.js')->onlyOnForms()) # loaded manually
;

SettingsCrudController:

public function configureFields(string $pageName): iterable
{
    yield BooleanField::new('option1');
    yield BooleanField::new('option2');
    yield ArrayField::new('domains');
}

Using Symfony 7.0 + Easyadmin 4.10, with default configurations and AssetMapper to load assets.

[davidmpaz]

Hi All,

I am having a similar situation. In my case I can add items (Image Entities) to the One to Many relation using a CollectionField field type with a sub-form, I can see the field-collection.js file is loaded. Everything is working as expected except the delete functionality.

The delete button is not working as expected. In the UI, the javascript works by removing the element from the html form, when it is submitted though, there is no effect, the elements in the collection are not deleted, no query on the backend, no interaction from browser to backend either. Seems that the edit functionality in controller do not recognizes the removed entities from collection.

Versions:

• Symfony Framework: 7.0.8
• EasyAdmin bundle: 4.10.2

My configuration of the field looks like:

CollectionField::new('images')
    ->setEntryType(ImageType::class)
    ->setFormTypeOption('by_reference', false)
    ->renderExpanded()
    ->onlyOnForms()

The configuration of the ImageType is like:

    public function buildForm(FormBuilderInterface $builder, array $options): void
    {
        $builder
            ->add('title')
            ->add('description')
            ->add('sortOrder')
            ->add('imageFile', VichImageType::class);
    }

More details:

• The entity relation is a normal one to many bidirectional relation. Edit Form fields are configured in the owner side: Apartments. And the owner entity has respective setters/getters and mutators (addImage, removeImage) methods
• Since I allow to delete, I can see a checkbox per image item. When checked, an UPDATE query is executed to set the image name column to null: UPDATE tb_image SET image_name = null, which allows me to change the image used for that entitiy.
• The Edit form is a multi tab form, not sure if it is relevant though.

Any suggestion where to look will be welcomed.

[Naroh091]

I'm noticing a similar issue as the one described by the OP, with the difference that for me field-collection.js is present in ea-edit pages but not in ea-new pages, so I can add/remove items if editing an entity but not if I'm creating a new one.