0

I need to add note to the form field using notice tag. for example

 <notice translate="true">Image size should be equal to some(here I
 need to pass dynamic value)</notice>

form.xml

 <field name="image" sortOrder="60" formElement="fileUploader">
            <settings>
                <notice translate="true">Image size should be equal to some(here I need to pass dynamic value)</notice>
                <label translate="true">Image</label>
                <componentType>fileUploader</componentType>
                <visible>true</visible>
            </settings>
            <formElements>
                <fileUploader>
                    <settings>
                        <allowedExtensions>jpg jpeg gif png</allowedExtensions>
                        <maxFileSize>102400</maxFileSize>
                        <uploaderConfig>
                            <param xsi:type="string" name="url">a/b/c</param>
                        </uploaderConfig>
                        <previewTmpl>x_y/image-preview</previewTmpl>
                    </settings>
                </fileUploader>
            </formElements>
        </field>
  • how to create form using ui-component? or simple – Birjitsinh Zala Jan 17 '18 at 13:11
  • I have created form using ui-component – Jaisa Jan 17 '18 at 13:12
  • <uiComponent name="vendor_department_addform"/> wait am write full code in ans – Birjitsinh Zala Jan 17 '18 at 13:15
0

view/adminhtml/layout/form_index_index.xml

<body>
        <referenceContainer name="content">
            <uiComponent name="vendor_department_addform"/>
        </referenceContainer>
    </body>

view/adminhtml/ui_component/vendor_department_addform.xml

<?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">
    <argument name="data" xsi:type="array">
        <item name="js_config" xsi:type="array">
            <item name="provider" xsi:type="string">vendor_department_addform.vendor_department_addform_data_source</item>
            <item name="deps" xsi:type="string">vendor_department_addform.vendor_department_addform_data_source</item>
        </item>
        <item name="label" xsi:type="string" translate="true">Department Information</item>
        <item name="layout" xsi:type="array">
            <item name="type" xsi:type="string">tabs</item>
        </item>
    </argument>
    <settings>
        <buttons>
            <button name="save" class="Vendor\Module\Block\Adminhtml\Add\SaveButton"/>
            <button name="reset" class="Vendor\Module\Block\Adminhtml\Add\ResetButton"/>
            <button name="back" class="Vendor\Module\Block\Adminhtml\Add\BackButton"/>
        </buttons>
    </settings>

    <dataSource name="vendor_department_addform_data_source">
        <argument name="dataProvider" xsi:type="configurableObject">
            <argument name="class" xsi:type="string">Vendor\Module\Model\DataProvider</argument>
            <argument name="name" xsi:type="string">vendor_department_addform_data_source</argument>
            <argument name="primaryFieldName" xsi:type="string">department_id</argument>
            <argument name="requestFieldName" xsi:type="string">id</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>
        <settings>
            <submitUrl path="vendor/department/save"/>
        </settings>
    </dataSource>

    <fieldset name="department_fieldset">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">Add new department</item>
            </item>
        </argument>

        <!-- This field represents form id and is hidden -->
        <field name="department_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="formElement" xsi:type="string">input</item>
                    <item name="source" xsi:type="string">jobportal</item>
                </item>
            </argument>
        </field>
        <!-- This field has data type 'text' and standard 'input' form element and looks like input -->
        <field name="title">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="label" xsi:type="string" translate="true">Title</item>
                    <item name="formElement" xsi:type="string">input</item>
                    <item name="source" xsi:type="string">jobportal</item>
                    <item name="dataScope" xsi:type="string">title</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="identifier">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="label" xsi:type="string" translate="true">Identifier</item>
                    <item name="formElement" xsi:type="string">input</item>
                    <item name="source" xsi:type="string">jobportal</item>
                    <item name="dataScope" xsi:type="string">identifier</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="description">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="label" xsi:type="string" translate="true">Description</item>
                    <item name="formElement" xsi:type="string">textarea</item>
                    <item name="source" xsi:type="string">jobportal</item>
                    <item name="dataScope" xsi:type="string">description</item>
                </item>
            </argument>
        </field>
        <field name="sort_order">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="label" xsi:type="string" translate="true">Sort order</item>
                    <item name="formElement" xsi:type="string">input</item>
                    <item name="source" xsi:type="string">jobportal</item>
                    <item name="dataScope" xsi:type="string">sort_order</item>
                    <item name="validation" xsi:type="array">
                        <item name="validate-number" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="status">
            <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">Vendor\Module\Model\Department\Source\SelectOption</item>
                <item name="config" xsi:type="array">
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="label" xsi:type="string" translate="true">Status</item>
                    <item name="formElement" xsi:type="string">select</item>
                    <item name="source" xsi:type="string">jobportal</item>
                    <item name="dataScope" xsi:type="string">status</item>
                    <!-- <item name="default" xsi:type="string">0</item> -->
                </item>
            </argument>
        </field>
    </fieldset>
</form>

Vendor\Module\Model\DataProvider.php this is use for form data

namespace Vendor\module\Model;

use Vendor\module\Model\ResourceModel\Department\CollectionFactory;

/**
 * Class DataProvider
 */
class DataProvider extends \Magento\Ui\DataProvider\AbstractDataProvider
{
    /**
     * @var \Custom\Module\Model\ResourceModel\Messages\Collection
     */
    protected $collection;

    /**
     * @var array
     */
    protected $loadedData;

    /**
     * @param string $name
     * @param string $primaryFieldName
     * @param string $requestFieldName
     * @param CollectionFactory $pageCollectionFactory
     * @param array $meta
     * @param array $data
     */
    public function __construct(
        $name,
        $primaryFieldName,
        $requestFieldName,
        CollectionFactory $pageCollectionFactory,

        array $meta = [],
        array $data = []
    ) {
        $this->collection = $pageCollectionFactory->create();
        parent::__construct($name, $primaryFieldName, $requestFieldName, $meta, $data);
        $this->meta = $this->prepareMeta($this->meta);
    }

    /**
     * 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();
        /** @var $page \Custom\Module\Model\Messages */
        foreach ($items as $page) {
            $this->loadedData[$page->getId()] = $page->getData();
        }
        //echo "<pre>";print_r($this->loadedData);die;
        return $this->loadedData;
    }
}
  • Thank you for your response, But my question is I need to add note to the form field. In that note message I need to pass dynamic values or data. For example <notice> Image size should be equal to some(here I need to pass dynamic value) size</notice> – Jaisa Jan 17 '18 at 13:24
  • dataprovider.php handle dynamic data – Birjitsinh Zala Jan 17 '18 at 13:27
  • Please see the updated post – Jaisa Jan 17 '18 at 13:30
  • <item name="component" xsi:type="string">Namespace_ModuleName/js/form/element/options</item> change using js – Birjitsinh Zala Jan 17 '18 at 13:48

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.