4

I've created an admin form UI component for an entity that I've created: Vehicle. The idea is that you can create/edit vehicles in Magento, and then assign them to products via a list component (similair like related products).

Here's a screenshot of the current state:

UI component overview

Current UI component setup:

<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">vehicle_form.vehicle_form_data_source</item>
            <item name="deps" xsi:type="string">vehicle_form.vehicle_form_data_source</item>
        </item>
        ....
        <insertListing name="insert_listing_example">
            <settings>
                <dataLinks>
                    <exports>true</exports>
                    <imports>false</imports>
                </dataLinks>
                <autoRender>true</autoRender>
                <dataScope>insert_listing_example</dataScope>
                <ns>insert_listing_example</ns>
                <exports>
                    <link name="id">vehicle_form.vehicle_form_data_source:linked_products</link>
                </exports>
            </settings>
        </insertListing>

The insert_listing_example list UI component is a copy from the devdocs:

<?xml version="1.0" encoding="UTF-8"?>
<listing xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <!-- https://magento.stackexchange.com/questions/204548/magento2-send-id-insertlisting-to-grid -->
    <argument name="data" xsi:type="array">
        <item name="js_config" xsi:type="array">
            <item name="provider" xsi:type="string">insert_listing_example.insert_listing_example_data_source</item>
        </item>
    </argument>
    <settings>
        <spinner>columns</spinner>
        <deps>
            <dep>insert_listing_example.insert_listing_example_data_source</dep>
        </deps>
    </settings>
    <dataSource name="insert_listing_example_data_source" component="Magento_Ui/js/grid/provider">
        <settings>
            <updateUrl path="mui/index/render"/>
        </settings>
        <dataProvider class="Vendor\Vehicles\Ui\Component\Listing\CustomDataProvider"
                      name="insert_listing_example_data_source">
            <settings>
                <requestFieldName>id</requestFieldName>
                <primaryFieldName>entity_id</primaryFieldName>
            </settings>
        </dataProvider>
    </dataSource>
    <listingToolbar name="listing_top">
        <columnsControls name="columns_controls"/>
        <filterSearch name="fulltext"/>
        <filters name="listing_filters"/>
    </listingToolbar>
    <columns name="columns">
        <selectionsColumn name="ids" sortOrder="10">
            <settings>
                <indexField>entity_id</indexField>
            </settings>
        </selectionsColumn>
        <column name="id" sortOrder="20">
            <settings>
                <filter>textRange</filter>
                <label translate="true">ID</label>
                <sorting>asc</sorting>
            </settings>
        </column>
        <column name="name" sortOrder="30">
            <settings>
                <filter>text</filter>
                <label translate="true">Name</label>
            </settings>
        </column>
    </columns>
</listing>

So how do I link the insert_listing_example to vehicle_form so that save the chosen item ID's to the database?

I was thinking to maybe (linking the properties)[https://devdocs.magento.com/guides/v2.3/ui_comp_guide/concepts/ui_comp_linking_concept.html] 'ID' field of the list with the 'linked products' field of the form. But I have no idea on how to do this. Any help would appreciated!

4
  • I'm attempting the exact same thing, ALSO with vehicles, in a project I am working on. Currently I'm adding the vehicle select grid to the product edit form. Trying to somehow link the selections to a field in the form.
    – sdaugherty
    Apr 23, 2020 at 5:47
  • Hi, did you solve this problem? Jul 9, 2020 at 11:48
  • Hello @Tijtse you got solution for this? Sep 2, 2020 at 12:00
  • @Tjitse why your exports tag is in insertListing component and not in listing component?
    – LucScu
    Jan 31, 2021 at 18:09

0

Your Answer

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