6

I have created a custom module and I am currently trying to implement a UI component form, however I am facing an issue: in my edit form data is not showing.

Below is UI form code with given path.

/app/code/Namespace/Modulename/view/adminhtml/ui_component/managelabels_productlabel_form.xml

<?xml version="1.0" ?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <argument name="data" xsi:type="array">
        <item name="js_config" xsi:type="array">
            <item name="provider" xsi:type="string">managelabels_productlabel_form.managelabels_productlabel_form_data_source</item>
<!--            <item name="deps" xsi:type="string">managelabels_productlabel_form.managelabels_productlabel_form_data_source</item>-->
        </item>
        <item name="label" translate="true" xsi:type="string">Label Options</item>
        <item name="config" xsi:type="array">
            <item name="dataScope" xsi:type="string">data</item>
            <item name="namespace" xsi:type="string">managelabels_productlabel_form</item>
        </item>
        <item name="reverseMetadataMerge" xsi:type="boolean">true</item>        
    </argument>
    <settings>
        <buttons>
                <button class="Namespace\Modulename\Block\Adminhtml\Productlabel\Edit\BackButton" name="back"/>
                <button class="Namespace\Modulename\Block\Adminhtml\Productlabel\Edit\DeleteButton" name="delete"/>
                <button class="Namespace\Modulename\Block\Adminhtml\Productlabel\Edit\SaveButton" name="save"/>
                <button class="Namespace\Modulename\Block\Adminhtml\Productlabel\Edit\SaveAndContinueButton" name="save_and_continue"/>
        </buttons>        
        <layout>
            <navContainerName>left</navContainerName>
            <type>tabs</type>
        </layout>
        <deps>
            <dep>managelabels_productlabel_form.managelabels_productlabel_form_data_source</dep>
        </deps>
    </settings>
    <dataSource name="managelabels_productlabel_form_data_source">
        <argument name="dataProvider" xsi:type="configurableObject">
            <argument name="class" xsi:type="string">Namespace\Modulename\Model\Productlabel\DataProvider</argument>
            <argument name="name" xsi:type="string">managelabels_productlabel_form_data_source</argument>
            <argument name="primaryFieldName" xsi:type="string">productlabel_id</argument>
            <argument name="requestFieldName" xsi:type="string">id</argument>
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="submit_url" xsi:type="url" path="managelabels/productlabel/save"/>
                </item>
            </argument>
        </argument>
        <argument name="data" xsi:type="array">
            <item name="js_config" xsi:type="array">
                <item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
            </item>
        </argument>
    </dataSource>
    <fieldset name="general">
        <settings>
            <label translate="true">General Info</label>
        </settings>
        <field name="productlabel_id">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="visible" xsi:type="boolean">false</item>
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="label" xsi:type="string" translate="true">Productlabel ID</item>
                    <item name="formElement" xsi:type="string">input</item>
                    <item name="source" xsi:type="string">data</item>
                    <item name="dataScope" xsi:type="string">productlabel_id</item>
                </item>
            </argument>
        </field>
        <field name="labelname" formElement="input">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="source" xsi:type="string">labelname</item>
                </item>
            </argument>
            <settings>
                <validation>
                    <rule name="required-entry" xsi:type="boolean">true</rule>
                </validation>
                <dataType>text</dataType>
                <label translate="true">Label Name</label>
            </settings>
        </field>
        <field name="is_active" sortOrder="10" formElement="checkbox">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="source" xsi:type="string">status</item>
                    <item name="default" xsi:type="number">1</item>
                </item>                
            </argument>
            <settings>
                <dataType>boolean</dataType>
                <label translate="true">Status</label>
                <dataScope>status</dataScope>
            </settings>
            <formElements>
                <checkbox>
                    <settings>
                        <valueMap>
                            <map name="false" xsi:type="number">0</map>
                            <map name="true" xsi:type="number">1</map>
                        </valueMap>
                        <prefer>toggle</prefer>
                    </settings>
                </checkbox>
            </formElements>
        </field>
        <field name="priority" formElement="input">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="source" xsi:type="string">priority</item>
                    <item name="notice" xsi:type="string" translate="true">Use 0 to show label first, and 99 to show it last</item>
                </item>
            </argument>
            <settings>
                <validation>
                    <rule name="required-entry" xsi:type="boolean">true</rule>
                </validation>
                <dataType>text</dataType>
                <label translate="true">Priority</label>
            </settings>
        </field>
        <field name="start_date">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">string</item>
                    <item name="label" xsi:type="string" translate="true">Start Date</item>
                    <item name="formElement" xsi:type="string">date</item>
                    <item name="source" xsi:type="string">page</item>
                    <item name="sortOrder" xsi:type="number">21</item>
                    <item name="dataScope" xsi:type="string">start_date</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                    <item name="options" xsi:type="array">
                        <item name="dateFormat" xsi:type="string">yyyy-MM-dd</item>
                        <item name="timeFormat" xsi:type="string">HH:mm:ss</item>
                        <item name="showsTime" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="end_date">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">string</item>
                    <item name="label" xsi:type="string" translate="true">Start Date</item>
                    <item name="formElement" xsi:type="string">date</item>
                    <item name="source" xsi:type="string">page</item>
                    <item name="sortOrder" xsi:type="number">21</item>
                    <item name="dataScope" xsi:type="string">end_date</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                    <item name="options" xsi:type="array">
                        <item name="dateFormat" xsi:type="string">yyyy-MM-dd</item>
                        <item name="timeFormat" xsi:type="string">HH:mm:ss</item>
                        <item name="showsTime" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>
        </field>        
    </fieldset>
    <fieldset name="labelconfig">
        <settings>
            <label translate="true">Label Configuration</label>
        </settings>
        <field name="image">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">string</item>
                    <item name="source" xsi:type="string">image</item>
                    <item name="label" xsi:type="string" translate="true">Image</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="formElement" xsi:type="string">fileUploader</item>
                    <item name="elementTmpl" xsi:type="string">ui/form/element/uploader/uploader</item>
                    <item name="previewTmpl" xsi:type="string">Namespace_Modulename/image-preview</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                    <item name="uploaderConfig" xsi:type="array">
                        <item name="url" xsi:type="url" path="managelabels/productlabel/upload"/>
                    </item>
                </item>
            </argument>
        </field>
        <field name="image_data" sortOrder="20" formElement="hidden">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="source" xsi:type="string">image</item>
                </item>
            </argument>
            <settings>
                <dataType>text</dataType>
                <label translate="true">Image Data</label>
                <dataScope>image_data</dataScope>
            </settings>
        </field>
        <field name="label_text" formElement="input">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="source" xsi:type="string">label_text</item>
                </item>
            </argument>
            <settings>                
                <dataType>text</dataType>
                <label translate="true">Label Text</label>
            </settings>
        </field>
        <field name="label_text_data" sortOrder="20" formElement="hidden">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="source" xsi:type="string">image</item>
                </item>
            </argument>
            <settings>
                <dataType>text</dataType>
                <label translate="true">Label Text Data</label>
                <dataScope>label_text_data</dataScope>
            </settings>
        </field>
    </fieldset>
    <fieldset name="condition">
        <settings>
            <label translate="true">Condition</label>
        </settings>        
        <field name="store_ids">
            <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">Magento\Cms\Ui\Component\Listing\Column\Cms\Options</item>
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">int</item>
                    <item name="label" xsi:type="string" translate="true">Store View</item>
                    <item name="formElement" xsi:type="string">multiselect</item>
                    <item name="source" xsi:type="string">page</item>
                    <item name="dataScope" xsi:type="string">store_ids</item>
                    <item name="default" xsi:type="string">0</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="customers_group_ids">
            <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">Magento\Cms\Ui\Component\Listing\Column\Cms\Options</item>
                <item name="config" xsi:type="array">
                    <item name="label" xsi:type="string" translate="true">Customer Groups</item>
                    <item name="dataType" xsi:type="string">number</item>
                    <item name="formElement" xsi:type="string">multiselect</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                    <item name="source" xsi:type="string">Namespace_Modulename</item>
                    <item name="dataScope" xsi:type="string">customers_group_ids</item>
                </item>
            </argument>
        </field>
        <container name="conditions_apply_to" sortOrder="10">
            <htmlContent name="html_content">
                <block name="conditions_apply_to" class="Namespace\Modulename\Block\Adminhtml\Productlabel\Edit\Tab\Conditions" />
            </htmlContent>
        </container>
    </fieldset>
</form>

Below is the UI dataprovider with given path.

/app/code/Namespace/Modulename/Model/Productlabel/DataProvider.php

<?php

namespace Namespace\Modulename\Model\Productlabel;

use Magento\Framework\App\Request\DataPersistorInterface;
use Magento\Ui\DataProvider\AbstractDataProvider;
use Namespace\Modulename\Model\ResourceModel\Productlabel\CollectionFactory;

class DataProvider extends AbstractDataProvider
{
    /**
     * @var ResourceModel\Data\Collection
     */
    protected $collection;

    /**
     * @var DataPersistorInterface
     */
    protected $dataPersistor;
    
    /**
     * @var array
     */
    protected $loadedData;
    
    /**
     * @param string $name
     * @param string $primaryFieldName
     * @param string $requestFieldName
     * @param CollectionFactory $pageCollectionFactory
     * @param DataPersistorInterface $dataPersistor
     * @param array $meta
     * @param array $data
     */
    public function __construct(
        $name,
        $primaryFieldName,
        $requestFieldName,
        CollectionFactory $pageCollectionFactory,
        DataPersistorInterface $dataPersistor,
        array $meta = [],
        array $data = []
    ) {
        $this->collection = $pageCollectionFactory->create();
        $this->dataPersistor = $dataPersistor;
        $this->meta = $this->prepareMeta($this->meta);
        parent::__construct($name, $primaryFieldName, $requestFieldName, $meta, $data);
    }
    
    /**
     * Prepares Meta
     *
     * @param array $meta
     * @return array
     */
    public function prepareMeta(array $meta)
    {
        return $meta;
    }
    
    /**
     * Get data
     *
     * @return array
     */
    public function getData()
    {
        if (isset($this->loadedData)) {
            return $this->loadedData;
        }
        $items = $this->collection->getItems();
        $ruleId = '';
        foreach ($items as $page) {
            $this->loadedData[$page->getId()] = $page->getData();
            $ruleId = $page->getId();
        }
        $data = $this->dataPersistor->get('module_messages');
        if (!empty($data)) {
            $page = $this->collection->getNewEmptyItem();
            $page->setData($data);
            $this->loadedData[$page->getId()] = $page->getData();
            $this->dataPersistor->clear('module_messages');
        }
        
        return $this->loadedData;
    }
}

There is something missing (or something wrong) in the above code but I can't find out what it is.

I tried a lot but I have had no luck to solve the problem. can anyone help me?

Any help would be appreciated! Thanks.

2
  • Were you ever able to figure this out?
    – Laura
    Oct 4, 2020 at 18:10
  • Chirag, 2 questions: - Did the answer below help your issue? - Does the above DataProvider also successfully supply an Admin grid? Jan 1, 2021 at 16:02

1 Answer 1

11

If you use setting tags in ui-component. You need to add data return include fieldset.
Example field "priority" will show "name='general['priority']' "

Your loadedData in function getData() should like this:

$this->loadedData[$page->getId()]['general'] = $page->getData();
2
  • 1
    what's the relation of settings tags with data? settings tag only has buttons related information. Please explain as your solution has worked for me but i'm trying to understand as well.
    – R T
    Oct 30, 2019 at 14:22
  • perfect answer!!! made my day :) +1 how about the multiple tabs rendering data ? May 20 at 21:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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