1

I have Two tables table1 has id and other fields and table2 which has id, foreign key of table1 and other fields.

I have create a ui listing for table1 and added a button to go in table2 ui listing. Currently when i click the button it goes to a new page where table2 list is shown.

Now i want to avoid going to other page to view the list. I want the list to be shown on same page. I want the list to be shown in a modal. Is there a way to do this?

<listing 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">celebrities_listing.celebrities_listing_data_source</item>
        <item name="deps" xsi:type="string">celebrities_listing.celebrities_listing_data_source</item>
    </item>
    <item name="spinner" xsi:type="string">spinner_columns</item>
    <item name="buttons" xsi:type="array">
        <item name="create_fp" xsi:type="array">
            <item name="name" xsi:type="string">add</item>
            <item name="label" xsi:type="string" translate="true">Add Celebrity</item>
            <item name="class" xsi:type="string">primary</item>
            <item name="url" xsi:type="string">*/*/add</item>
        </item>
    </item>
</argument>
<dataSource name="celebrities_listing_data_source">
    <argument name="dataProvider" xsi:type="configurableObject">
        <argument name="class" xsi:type="string">Magento\Framework\View\Element\UiComponent\DataProvider\DataProvider</argument>
        <argument name="name" xsi:type="string">celebrities_listing_data_source</argument>
        <argument name="primaryFieldName" xsi:type="string">celebrity_id</argument>
        <argument name="requestFieldName" xsi:type="string">id</argument>
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="update_url" xsi:type="url" path="mui/index/render"/>
            </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/grid/provider</item>
        </item>
    </argument>
</dataSource>
<listingToolbar name="listing_top">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="sticky" xsi:type="boolean">true</item>
        </item>
    </argument>
    <paging name="listing_paging"/>
    <filters name="listing_filters" />
</listingToolbar>
<columns name="spinner_columns">
    <selectionsColumn name="ids">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="resizeEnabled" xsi:type="boolean">false</item>
                <item name="resizeDefaultWidth" xsi:type="string">55</item>
                <item name="indexField" xsi:type="string">celebrity_id</item>
            </item>
        </argument>
    </selectionsColumn>
    <column name="celebrity_id">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="filter" xsi:type="string">textRange</item>
                <item name="label" xsi:type="string" translate="true">Celebrity ID</item>
            </item>
        </argument>
    </column>
    <column name="celebrity_name">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="filter" xsi:type="string">text</item>
                <item name="dataType" xsi:type="string">text</item>
                <item name="label" xsi:type="string" translate="true">Celebrity name</item>
            </item>
        </argument>
    </column>
    <column name="ordering">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">Order</item>
            </item>
        </argument>
    </column>
    <column name="url">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">Url</item>
            </item>
        </argument>
    </column>
    <actionsColumn name="actions" class="Vendor\Module\Ui\Component\Listing\Column\ListAction">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="indexField" xsi:type="string">id</item>
            </item>
        </argument>
    </actionsColumn>
</columns>

  • yes, possible. But this is big task to creating your requirement. It will be easy if you share your code here. – Sohel Rana May 8 at 6:34
  • ok wait sharing. – Avesh Naik May 8 at 6:41
  • @SohelRana Added the Code please Check. – Avesh Naik May 8 at 6:47

Your Answer

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

Browse other questions tagged or ask your own question.