2

I'm on Magento 2.4.4, I want to add in my custom module Vendor_Picto a specific field (list of selectable images) in the admin form. It is too specific to be generated in the ui_component/picto_form.xml.

I found this official doc: https://devdocs.magento.com/guides/v2.4/ui_comp_guide/concepts/ui_comp_modifier_concept.html

EDIT : I had an error with the code example from the doc : The "componentType" configuration parameter is required for the "test_fieldset_name" component. This attribute was missing in $meta['test_fieldset_name']['arguments']['data']['config'] : 'componentType' => Fieldset::NAME

It helped me write these 2 files so far:

1.Created the modifier Vendor\Picto\Ui\DataProvider\Form\Modifier\Icon.php

<?php

namespace Vendor\Picto\Ui\DataProvider\Form\Modifier;

use Magento\Ui\DataProvider\Modifier\ModifierInterface;

class Icon implements ModifierInterface
{
    public function modifyMeta(array $meta)
    {
        $meta['test_fieldset_name'] = [
            'arguments' => [
                'data' => [
                    'config' => [
                        'label' => __('Label For Fieldset'),
                        'sortOrder' => 50,
                        'collapsible' => true,
                        'componentType' => Fieldset::NAME
                    ]
                ]
            ],
            'children' => [
                'test_field_name' => [
                    'arguments' => [
                        'data' => [
                            'config' => [
                                'formElement' => 'select',
                                'componentType' => 'field',
                                'options' => [
                                    ['value' => 'test_value_1', 'label' => 'Test Value 1'],
                                    ['value' => 'test_value_2', 'label' => 'Test Value 2'],
                                    ['value' => 'test_value_3', 'label' => 'Test Value 3'],
                                ],
                                'visible' => 1,
                                'required' => 1,
                                'label' => __('Label For Element')
                            ]
                        ]
                    ]
                ]
            ]
        ];

        return $meta;
    }

    /**
     * {@inheritdoc}
     */
    public function modifyData(array $data)
    {
        return $data;
    }
}

2.Created etc/adminhtml/di.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <virtualType name="Vendor\Picto\DataProvider\Form\Modifier\Pool" type="Magento\Ui\DataProvider\Modifier\Pool">
        <arguments>
            <argument name="modifiers" xsi:type="array">
                <item name="modifier_name" xsi:type="array">
                    <item name="class" xsi:type="string">Vendor\Picto\Ui\DataProvider\Form\Modifier\Icon</item>
                    <item name="sortOrder" xsi:type="number">10</item>
                </item>
            </argument>
        </arguments>
    </virtualType>
    <type name="Vendor\Picto\Ui\DataProvider\PictoDataProvider">
        <arguments>
            <argument name="pool" xsi:type="object">Vendor\Picto\DataProvider\Form\Modifier\Pool</argument>
        </arguments>
    </type>
</config>

Unfortunately nothing new appears in my admin form and I have no errors.

I am probably missing something but there is no more information in the doc...

1 Answer 1

2

You didn't specify how you declare PictoDataProvider in your picto_form.xml and content of PictoDataProvider.

Declaration should be like:

<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <!-- ... -->
    <dataSource name="...">
        <dataProvider class="Vendor\Picto\Ui\DataProvider\PictoDataProvider" name="...">
            <!-- ... -->
        </dataProvider>
    </dataSource>
</form>

PictoDataProvider should implement \Magento\ReleaseNotification\Ui\DataProvider, has argument PoolInterface $pool in __construct and implement logic for process data

// ...
class PictoDataProvider implements \Magento\Framework\View\Element\UiComponent\DataProvider\DataProviderInterface
{
    // ...
    private \Magento\Ui\DataProvider\Modifier\PoolInterface $pool;

    // ...

    public function __construct(
        string $name,
        \Magento\Framework\Api\Search\SearchResultInterface $searchResult,
        \Magento\Framework\Api\Search\SearchCriteriaInterface $searchCriteria,
        \Magento\Ui\DataProvider\Modifier\PoolInterface $pool,
        array $meta = [],
        array $data = []
    ) {
        // ...
        $this->pool = $pool;
    }

    /**
     * @inheritdoc
     */
    public function getData(): array
    {
        /** @var \Magento\Ui\DataProvider\Modifier\ModifierInterface $modifier */
        foreach ($this->pool->getModifiersInstances() as $modifier) {
            $this->data = $modifier->modifyData($this->data);
        }

        return $this->data;
    }

    /**
     * @inheritdoc
     */
    public function getMeta()
    {
        /** @var \Magento\Ui\DataProvider\Modifier\ModifierInterface $modifier */
        foreach ($this->pool->getModifiersInstances() as $modifier) {
            $this->meta = $modifier->modifyMeta($this->meta);
        }

        return $this->meta;
    }
    // ...
}
1
  • Thanks you! My getData() function had a mistake
    – adrien54
    Jun 30 at 7:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.