0

I am developing a custom module for Magento 2.2.x which should allow users to associate products to custom entity.

What I would like to do is to show a product grid in the edit form of the custom entity where users can search and select which products associate the custom entity.

I already created the form with uicomponent, this is the layout XML (customentity_entity_edit.xml)

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="admin-1column"
      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="page.main.actions">
            <block class="Magento\Backend\Block\Store\Switcher" name="customentity_entity_look.store.switcher" template="Magento_Backend::store/switcher.phtml" >
                <action method="setUseConfirm">
                    <argument name="params" xsi:type="string">1</argument>
                </action>
            </block>
        </referenceContainer>
        <referenceContainer name="content">
            <uiComponent name="customentity_entity_look_form"/>
        </referenceContainer>
    </body>
</page>

This is the xml of the form (customentity_entity_look_form.xml)

<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    ...
    <fieldset name="main_fieldset">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">Main Information</item>
            </item>
        </argument>
        <field name="store_id">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">number</item>
                    <item name="formElement" xsi:type="string">hidden</item>
                    <!--<item name="default" xsi:type="number">0</item>-->
                    <item name="sortOrder" xsi:type="string">10</item>
                    <item name="source" xsi:type="string">main_fieldset</item>
                </item>
            </argument>
        </field>
        <field name="entity_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">main_fieldset</item>
                </item>
            </argument>
        </field>
        <field name="name">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="label" xsi:type="string">Name</item>
                    <item name="formElement" xsi:type="string">input</item>
                    <item name="source" xsi:type="string">main_fieldset</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                    <item name="sortOrder" xsi:type="number">10</item>
                    <item name="scopeLabel" xsi:type="string">[STORE]</item>
                </item>
            </argument>
        </field>
    </fieldset>
    <fieldset name="assign_products">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">Assign Products</item>
                <item name="collapsible" xsi:type="boolean">true</item>
                <item name="sortOrder" xsi:type="number">40</item>
            </item>
        </argument>
        <container name="assign_products_container" >
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">60</item>
                </item>
            </argument>
            <htmlContent name="html_content">
                <argument name="block" xsi:type="object">\Vendor\Module\Block\To\Show\Product\Grid</argument>
            </htmlContent>
        </container>
    </fieldset>
</form>

I don't know how to implement the block which should render the product grid (\Vendor\Module\Block\To\Show\Product\Grid)

I tried to follow this Magento 2 : How to add a product grid in custom module using ui component? but it throws several errors at runtime and it uses deprecated core classes.

Is there a standard way to show this control in a form of a custom module?

| improve this question | |
2

You can make innergrid with also ui-component using innserlisting

 <insertListing>
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="autoRender" xsi:type="boolean">true</item>
                <item name="ns" xsi:type="string">make_custom_listing</item>
            </item>
        </argument>
    </insertListing>
| improve this answer | |
  • thank you for pointing me in a direction. however I am not able to fetch the product for the listing. Is there any good example/tutorial I can follow? – gianis6 Aug 28 '18 at 14:28
  • just replace innerlisting code with <htmlContent name="html_content"> <argument name="block" xsi:type="object">\Vendor\Module\Block\To\Show\Product\Grid</argument> </htmlContent> code – Rutvee Sojitra Aug 29 '18 at 3:53
  • And make another grid for product listing – Rutvee Sojitra Aug 29 '18 at 3:53
  • ok, but how do I fetch the products? – gianis6 Aug 29 '18 at 7:18
  • In that product listing you can define datasource and using that datasource you use model,resourcemodel and grid-collection Here is the example of how to create admin grid mageplaza.com/magento-2-module-development/… – Rutvee Sojitra Aug 29 '18 at 7:43

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.