0

I have created a grid using the UI component. When I go to the grid the loader keeps spinning endlessly and the grid doesn't show. I have attached screen shot and code below

Image

di.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../lib/internal/Magento/Framework/ObjectManager/etc/config.xsd">
    <type name="Magento\Framework\View\Element\UiComponent\DataProvider\CollectionFactory">
        <arguments>
            <argument name="collections" xsi:type="array">
                <item name="vendor_form_grid_listing_data_source" xsi:type="string">Vendor\Form\Model\ResourceModel\Form\Collection</item>
            </argument>
        </arguments>
    </type>
    <virtualType name="Vendor\Form\Model\ResourceModel\Form\Collection" type="Magento\Framework\View\Element\UiComponent\DataProvider\SearchResult">
        <arguments>
            <argument name="mainTable" xsi:type="string">vendor_product_info</argument>
            <argument name="resourceModel" xsi:type="string">Vendor\Form\Model\ResourceModel\Form</argument>
        </arguments>
    </virtualType>
</config>

grid_grid_listing.xml - UI component

<?xml version="1.0"?>
<!---{router_id}_{controller_name}_listing-->
<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">vendor_form_grid_listing.vendor_form_grid_listing_data_source</item>
            <item name="deps" xsi:type="string">vendor_form_grid_listing.vendor_form_grid_listing_data_source</item>
        </item>
        <!--<item name="spinner" xsi:type="string">spinner_columns</item>-->
        <item name="buttons" xsi:type="array">
            <item name="add" xsi:type="array">
                <item name="name" xsi:type="string">add</item>
                <item name="label" xsi:type="string" translate="true">Add New Post</item>
                <item name="class" xsi:type="string">primary</item>
                <item name="url" xsi:type="string">*/*/new</item>
            </item>
        </item>
    </argument>
    <dataSource name="vendor_form_grid_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">vendor_form_grid_listing_data_source</argument>
            <argument name="primaryFieldName" xsi:type="string">product_id</argument>
            <argument name="requestFieldName" xsi:type="string">id</argument>
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="component" xsi:type="string">Magento_Ui/js/grid/provider</item>
                    <item name="update_url" xsi:type="url" path="mui/index/render"/>
                    <item name="storageConfig" xsi:type="array">
                        <item name="indexField" xsi:type="string">product_id</item>
                    </item>
                </item>
            </argument>
        </argument>
    </dataSource>
    <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">product_id</item>
                </item>
            </argument>
        </selectionsColumn>
        <column name="product_id">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">textRange</item>
                    <item name="sorting" xsi:type="string">asc</item>
                    <item name="label" xsi:type="string" translate="true">ID</item>
                </item>
            </argument>
        </column>
        <column name="name">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="filter" xsi:type="string">text</item>
                    <item name="editor" xsi:type="array">
                        <item name="editorType" xsi:type="string">text</item>
                        <item name="validation" xsi:type="array">
                            <item name="required-entry" xsi:type="boolean">true</item>
                        </item>
                    </item>
                    <item name="label" xsi:type="string" translate="true">Name</item>
                </item>
            </argument>
        </column>
    </columns>
</listing>
  • check the console log – Haritha Aug 26 '19 at 10:13
  • @Haritha no error in console – surbhi agr Aug 26 '19 at 10:24
  • un-comment this line <item name="spinner" xsi:type="string">spinner_columns</item> – Mohit Rane Aug 26 '19 at 10:34
  • @MohitRane , no result – surbhi agr Aug 26 '19 at 10:52
  • have you tried after cache:flush? – Mohit Rane Aug 26 '19 at 10:54
1

I solved the problem. The issue was in the format of defining of items in ui component file

<item name="js_config" xsi:type="array">
        <item name="provider" xsi:type="string">grid_grid_listing.vendor_form_grid_listing_data_source</item>
        <!-- the format here is uicomponentname.datasourcename -->
        <item name="deps" xsi:type="string">grid_grid_listing.vendor_form_grid_listing_data_source</item>
        <!-- the format here is uicomponentname.datasourcename -->
    </item>
| improve this answer | |
  • 1
    Amazing!! Worked for me as well. Thank you so much. – Dacod Jan 30 at 9:16
0

vendor_form_grid_listing.vendor_form_grid_listing_data_source

the file name and provider is different.

| improve this answer | |

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.