How to create grid using ui component for custom eav model












1















I have created a new entity type and custom EAV model. Now i am trying to create grid for it using ui component. How we can use the eav data collection instead of flat table for grid?










share|improve this question























  • Did you solve this issue?

    – Emipro Technologies Pvt. Ltd.
    Feb 23 at 5:57











  • Yes I did solve it by creating a new datasource which was pretty simple just extending MagentoFrameworkViewElementUiComponentDataProviderDataProvider Let me know if you need any help with it. I will be really happy to help :)

    – Sarvagya
    Feb 23 at 17:36











  • Can you please upload your file code here? It will be really helpful for me and other also.

    – Emipro Technologies Pvt. Ltd.
    yesterday











  • Hi @Sarvagya can you please upload your code in answer?

    – Emipro Technologies Pvt. Ltd.
    23 hours ago











  • @EmiproTechnologiesPvt.Ltd. Hey Sorry for the late reply was away. I have mentioned the similar component file in the answer. I can't post the exact code due to some agreements. Let me know if you need any other help for this.

    – Sarvagya
    6 mins ago
















1















I have created a new entity type and custom EAV model. Now i am trying to create grid for it using ui component. How we can use the eav data collection instead of flat table for grid?










share|improve this question























  • Did you solve this issue?

    – Emipro Technologies Pvt. Ltd.
    Feb 23 at 5:57











  • Yes I did solve it by creating a new datasource which was pretty simple just extending MagentoFrameworkViewElementUiComponentDataProviderDataProvider Let me know if you need any help with it. I will be really happy to help :)

    – Sarvagya
    Feb 23 at 17:36











  • Can you please upload your file code here? It will be really helpful for me and other also.

    – Emipro Technologies Pvt. Ltd.
    yesterday











  • Hi @Sarvagya can you please upload your code in answer?

    – Emipro Technologies Pvt. Ltd.
    23 hours ago











  • @EmiproTechnologiesPvt.Ltd. Hey Sorry for the late reply was away. I have mentioned the similar component file in the answer. I can't post the exact code due to some agreements. Let me know if you need any other help for this.

    – Sarvagya
    6 mins ago














1












1








1








I have created a new entity type and custom EAV model. Now i am trying to create grid for it using ui component. How we can use the eav data collection instead of flat table for grid?










share|improve this question














I have created a new entity type and custom EAV model. Now i am trying to create grid for it using ui component. How we can use the eav data collection instead of flat table for grid?







magento2 admin magento-2.1 grid eav






share|improve this question













share|improve this question











share|improve this question




share|improve this question










asked Feb 7 '17 at 12:30









SarvagyaSarvagya

76021638




76021638













  • Did you solve this issue?

    – Emipro Technologies Pvt. Ltd.
    Feb 23 at 5:57











  • Yes I did solve it by creating a new datasource which was pretty simple just extending MagentoFrameworkViewElementUiComponentDataProviderDataProvider Let me know if you need any help with it. I will be really happy to help :)

    – Sarvagya
    Feb 23 at 17:36











  • Can you please upload your file code here? It will be really helpful for me and other also.

    – Emipro Technologies Pvt. Ltd.
    yesterday











  • Hi @Sarvagya can you please upload your code in answer?

    – Emipro Technologies Pvt. Ltd.
    23 hours ago











  • @EmiproTechnologiesPvt.Ltd. Hey Sorry for the late reply was away. I have mentioned the similar component file in the answer. I can't post the exact code due to some agreements. Let me know if you need any other help for this.

    – Sarvagya
    6 mins ago



















  • Did you solve this issue?

    – Emipro Technologies Pvt. Ltd.
    Feb 23 at 5:57











  • Yes I did solve it by creating a new datasource which was pretty simple just extending MagentoFrameworkViewElementUiComponentDataProviderDataProvider Let me know if you need any help with it. I will be really happy to help :)

    – Sarvagya
    Feb 23 at 17:36











  • Can you please upload your file code here? It will be really helpful for me and other also.

    – Emipro Technologies Pvt. Ltd.
    yesterday











  • Hi @Sarvagya can you please upload your code in answer?

    – Emipro Technologies Pvt. Ltd.
    23 hours ago











  • @EmiproTechnologiesPvt.Ltd. Hey Sorry for the late reply was away. I have mentioned the similar component file in the answer. I can't post the exact code due to some agreements. Let me know if you need any other help for this.

    – Sarvagya
    6 mins ago

















Did you solve this issue?

– Emipro Technologies Pvt. Ltd.
Feb 23 at 5:57





Did you solve this issue?

– Emipro Technologies Pvt. Ltd.
Feb 23 at 5:57













Yes I did solve it by creating a new datasource which was pretty simple just extending MagentoFrameworkViewElementUiComponentDataProviderDataProvider Let me know if you need any help with it. I will be really happy to help :)

– Sarvagya
Feb 23 at 17:36





Yes I did solve it by creating a new datasource which was pretty simple just extending MagentoFrameworkViewElementUiComponentDataProviderDataProvider Let me know if you need any help with it. I will be really happy to help :)

– Sarvagya
Feb 23 at 17:36













Can you please upload your file code here? It will be really helpful for me and other also.

– Emipro Technologies Pvt. Ltd.
yesterday





Can you please upload your file code here? It will be really helpful for me and other also.

– Emipro Technologies Pvt. Ltd.
yesterday













Hi @Sarvagya can you please upload your code in answer?

– Emipro Technologies Pvt. Ltd.
23 hours ago





Hi @Sarvagya can you please upload your code in answer?

– Emipro Technologies Pvt. Ltd.
23 hours ago













@EmiproTechnologiesPvt.Ltd. Hey Sorry for the late reply was away. I have mentioned the similar component file in the answer. I can't post the exact code due to some agreements. Let me know if you need any other help for this.

– Sarvagya
6 mins ago





@EmiproTechnologiesPvt.Ltd. Hey Sorry for the late reply was away. I have mentioned the similar component file in the answer. I can't post the exact code due to some agreements. Let me know if you need any other help for this.

– Sarvagya
6 mins ago










2 Answers
2






active

oldest

votes


















1














I've been able to do this within the admin section. You need to have your ResourceModel collection extend from the MagentoEavModelEntityCollectionAbstractCollection class. Within your Grid Data provider, load the collection and use addAttributeToSelect('*'):



class Grid extends MagentoUiDataProviderAbstractDataProvider
{

public function __construct(
....
[Namespace][Module]ModelResourceModel[Obj]CollectionFactory $collectionFactory,
....
) {
....
$collection = $collectionFactory->create();
$collection->addAttributeToSelect('*');
$this->collection = $collection;
...
}}


which will load up the attribute values, then you need to specify the columns in the grid in your [Namespace][Module]/view/[loc]/ui_component/[ui_component_grid_name].xml layout:



<listing ...>
...
<columns ...>
...
<column name="[attribute_code]">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
...
<item name="label" xsi:type="string" translate="true">[Attribute Label]</item>
...
</item>
</argument>
</column>
...
</columns>







share|improve this answer































    0














    Here is component file which can be helpful. This is not the exact code I am using but similar to that.




    P.S: I have used this code in 2017 for magento 2.1




     <?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">
    <argument name="data" xsi:type="array">
    <item name="js_config" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
    <item name="deps" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
    </item>
    <item name="spinner" xsi:type="string">vendorname_modulename_supplier_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 Contact</item>
    <item name="class" xsi:type="string">primary</item>
    <item name="url" xsi:type="string">*/*/edit</item>
    </item>
    </item>
    </argument>
    <dataSource name="vendorname_modulename_supplier_listing_data_source">
    <argument name="dataProvider" xsi:type="configurableObject">
    <argument name="class" xsi:type="string">VendornameModulenameUiComponentListingDataProvider</argument>
    <argument name="name" xsi:type="string">vendorname_modulename_supplier_listing_data_source</argument>
    <argument name="primaryFieldName" xsi:type="string">entity_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>
    <container name="listing_top">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="template" xsi:type="string">ui/grid/toolbar</item>
    </item>
    </argument>
    <bookmark name="bookmarks">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="storageConfig" xsi:type="array">
    <item name="namespace" xsi:type="string">vendorname_modulename_supplier_listing</item>
    </item>
    </item>
    </argument>
    </bookmark>
    <component name="columns_controls">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="columnsData" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns</item>
    </item>
    <item name="component" xsi:type="string">Magento_Ui/js/grid/controls/columns</item>
    <item name="displayArea" xsi:type="string">dataGridActions</item>
    </item>
    </argument>
    </component>
    <filterSearch name="fulltext">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
    <item name="chipsProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.listing_filters_chips</item>
    <item name="storageConfig" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
    <item name="namespace" xsi:type="string">current.search</item>
    </item>
    </item>
    </argument>
    </filterSearch>
    <filters name="listing_filters">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="columnsProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns</item>
    <item name="storageConfig" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
    <item name="namespace" xsi:type="string">current.filters</item>
    </item>
    <item name="templates" xsi:type="array">
    <item name="filters" xsi:type="array">
    <item name="select" xsi:type="array">
    <item name="component" xsi:type="string">Magento_Ui/js/form/element/ui-select</item>
    <item name="template" xsi:type="string">ui/grid/filters/elements/ui-select</item>
    </item>
    </item>
    </item>
    <item name="childDefaults" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.listing_filters</item>
    <item name="imports" xsi:type="array">
    <item name="visible" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.${ $.index }:visible</item>
    </item>
    </item>
    </item>
    </argument>
    </filters>
    <massaction name="listing_massaction">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
    <item name="indexField" xsi:type="string">entity_id</item>
    </item>
    </argument>
    <action name="delete">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="type" xsi:type="string">delete</item>
    <item name="label" xsi:type="string" translate="true">Delete</item>
    <item name="url" xsi:type="url" path="*/*/massDelete"/>
    <item name="confirm" xsi:type="array">
    <item name="title" xsi:type="string" translate="true">Delete items</item>
    <item name="message" xsi:type="string" translate="true">Are you sure you wan't to delete selected items?</item>
    </item>
    </item>
    </argument>
    </action>
    <action name="edit">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="type" xsi:type="string">edit</item>
    <item name="label" xsi:type="string" translate="true">Edit</item>
    <item name="callback" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns_editor</item>
    <item name="target" xsi:type="string">editSelected</item>
    </item>
    </item>
    </argument>
    </action>
    </massaction>
    <paging name="listing_paging">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="storageConfig" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
    <item name="namespace" xsi:type="string">current.paging</item>
    </item>
    <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
    </item>
    </argument>
    </paging>
    </container>
    <columns name="vendorname_modulename_supplier_columns">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="storageConfig" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
    <item name="namespace" xsi:type="string">current</item>
    </item>
    <item name="editorConfig" xsi:type="array">
    <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
    <item name="enabled" xsi:type="boolean">false</item>
    <item name="indexField" xsi:type="string">entity_id</item>
    <item name="clientConfig" xsi:type="array">
    <item name="saveUrl" xsi:type="url" path="*/*/inlineEdit"/>
    <item name="validateBeforeSave" xsi:type="boolean">false</item>
    </item>
    </item>
    <item name="childDefaults" xsi:type="array">
    <item name="fieldAction" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns_editor</item>
    <item name="target" xsi:type="string">startEdit</item>
    <item name="params" xsi:type="array">
    <item name="0" xsi:type="string">${ $.$data.rowIndex }</item>
    <item name="1" xsi:type="boolean">true</item>
    </item>
    </item>
    <item name="storageConfig" xsi:type="array">
    <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
    <item name="root" xsi:type="string">columns.${ $.index }</item>
    <item name="namespace" xsi:type="string">current.${ $.storageConfig.root }</item>
    </item>
    </item>
    </item>
    </argument>
    <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">entity_id</item>
    </item>
    </argument>
    </selectionsColumn>
    <column name="entity_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="title">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="filter" xsi:type="string">text</item>
    <item name="label" xsi:type="string" translate="true">Title</item>
    </item>
    </argument>
    </column>

    <column name="enabled" class="VendornameModulenameUiComponentListingColumnStatus" >
    <argument name="data" xsi:type="array">
    <item name="options" xsi:type="object">VendornameModulenameModelConfigSourceOptionsYesno</item>
    <item name="config" xsi:type="array">
    <item name="filter" xsi:type="string">select</item>
    <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/select</item>
    <item name="dataType" xsi:type="string">select</item>
    <item name="label" xsi:type="string" translate="true">Enabled</item>
    </item>
    </argument>
    </column>

    <column name="supplier_type" class="VendornameModulenameUiComponentListingColumnContacttype">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="filter" xsi:type="string">text</item>
    <item name="label" xsi:type="string" translate="true">Contact Type</item>
    </item>
    </argument>
    </column>

    <actionsColumn name="actions" class="VendornameModulenameUiComponentListingColumnContactActions">
    <argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="indexField" xsi:type="string">entity_id</item>
    </item>
    </argument>
    </actionsColumn>
    </columns>
    </listing>




    share























      Your Answer








      StackExchange.ready(function() {
      var channelOptions = {
      tags: "".split(" "),
      id: "479"
      };
      initTagRenderer("".split(" "), "".split(" "), channelOptions);

      StackExchange.using("externalEditor", function() {
      // Have to fire editor after snippets, if snippets enabled
      if (StackExchange.settings.snippets.snippetsEnabled) {
      StackExchange.using("snippets", function() {
      createEditor();
      });
      }
      else {
      createEditor();
      }
      });

      function createEditor() {
      StackExchange.prepareEditor({
      heartbeatType: 'answer',
      autoActivateHeartbeat: false,
      convertImagesToLinks: false,
      noModals: true,
      showLowRepImageUploadWarning: true,
      reputationToPostImages: null,
      bindNavPrevention: true,
      postfix: "",
      imageUploader: {
      brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
      contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
      allowUrls: true
      },
      onDemand: true,
      discardSelector: ".discard-answer"
      ,immediatelyShowMarkdownHelp:true
      });


      }
      });














      draft saved

      draft discarded


















      StackExchange.ready(
      function () {
      StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f158564%2fhow-to-create-grid-using-ui-component-for-custom-eav-model%23new-answer', 'question_page');
      }
      );

      Post as a guest















      Required, but never shown

























      2 Answers
      2






      active

      oldest

      votes








      2 Answers
      2






      active

      oldest

      votes









      active

      oldest

      votes






      active

      oldest

      votes









      1














      I've been able to do this within the admin section. You need to have your ResourceModel collection extend from the MagentoEavModelEntityCollectionAbstractCollection class. Within your Grid Data provider, load the collection and use addAttributeToSelect('*'):



      class Grid extends MagentoUiDataProviderAbstractDataProvider
      {

      public function __construct(
      ....
      [Namespace][Module]ModelResourceModel[Obj]CollectionFactory $collectionFactory,
      ....
      ) {
      ....
      $collection = $collectionFactory->create();
      $collection->addAttributeToSelect('*');
      $this->collection = $collection;
      ...
      }}


      which will load up the attribute values, then you need to specify the columns in the grid in your [Namespace][Module]/view/[loc]/ui_component/[ui_component_grid_name].xml layout:



      <listing ...>
      ...
      <columns ...>
      ...
      <column name="[attribute_code]">
      <argument name="data" xsi:type="array">
      <item name="config" xsi:type="array">
      ...
      <item name="label" xsi:type="string" translate="true">[Attribute Label]</item>
      ...
      </item>
      </argument>
      </column>
      ...
      </columns>







      share|improve this answer




























        1














        I've been able to do this within the admin section. You need to have your ResourceModel collection extend from the MagentoEavModelEntityCollectionAbstractCollection class. Within your Grid Data provider, load the collection and use addAttributeToSelect('*'):



        class Grid extends MagentoUiDataProviderAbstractDataProvider
        {

        public function __construct(
        ....
        [Namespace][Module]ModelResourceModel[Obj]CollectionFactory $collectionFactory,
        ....
        ) {
        ....
        $collection = $collectionFactory->create();
        $collection->addAttributeToSelect('*');
        $this->collection = $collection;
        ...
        }}


        which will load up the attribute values, then you need to specify the columns in the grid in your [Namespace][Module]/view/[loc]/ui_component/[ui_component_grid_name].xml layout:



        <listing ...>
        ...
        <columns ...>
        ...
        <column name="[attribute_code]">
        <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
        ...
        <item name="label" xsi:type="string" translate="true">[Attribute Label]</item>
        ...
        </item>
        </argument>
        </column>
        ...
        </columns>







        share|improve this answer


























          1












          1








          1







          I've been able to do this within the admin section. You need to have your ResourceModel collection extend from the MagentoEavModelEntityCollectionAbstractCollection class. Within your Grid Data provider, load the collection and use addAttributeToSelect('*'):



          class Grid extends MagentoUiDataProviderAbstractDataProvider
          {

          public function __construct(
          ....
          [Namespace][Module]ModelResourceModel[Obj]CollectionFactory $collectionFactory,
          ....
          ) {
          ....
          $collection = $collectionFactory->create();
          $collection->addAttributeToSelect('*');
          $this->collection = $collection;
          ...
          }}


          which will load up the attribute values, then you need to specify the columns in the grid in your [Namespace][Module]/view/[loc]/ui_component/[ui_component_grid_name].xml layout:



          <listing ...>
          ...
          <columns ...>
          ...
          <column name="[attribute_code]">
          <argument name="data" xsi:type="array">
          <item name="config" xsi:type="array">
          ...
          <item name="label" xsi:type="string" translate="true">[Attribute Label]</item>
          ...
          </item>
          </argument>
          </column>
          ...
          </columns>







          share|improve this answer













          I've been able to do this within the admin section. You need to have your ResourceModel collection extend from the MagentoEavModelEntityCollectionAbstractCollection class. Within your Grid Data provider, load the collection and use addAttributeToSelect('*'):



          class Grid extends MagentoUiDataProviderAbstractDataProvider
          {

          public function __construct(
          ....
          [Namespace][Module]ModelResourceModel[Obj]CollectionFactory $collectionFactory,
          ....
          ) {
          ....
          $collection = $collectionFactory->create();
          $collection->addAttributeToSelect('*');
          $this->collection = $collection;
          ...
          }}


          which will load up the attribute values, then you need to specify the columns in the grid in your [Namespace][Module]/view/[loc]/ui_component/[ui_component_grid_name].xml layout:



          <listing ...>
          ...
          <columns ...>
          ...
          <column name="[attribute_code]">
          <argument name="data" xsi:type="array">
          <item name="config" xsi:type="array">
          ...
          <item name="label" xsi:type="string" translate="true">[Attribute Label]</item>
          ...
          </item>
          </argument>
          </column>
          ...
          </columns>








          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Feb 10 '17 at 19:49









          dbcndbcn

          394213




          394213

























              0














              Here is component file which can be helpful. This is not the exact code I am using but similar to that.




              P.S: I have used this code in 2017 for magento 2.1




               <?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">
              <argument name="data" xsi:type="array">
              <item name="js_config" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
              <item name="deps" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
              </item>
              <item name="spinner" xsi:type="string">vendorname_modulename_supplier_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 Contact</item>
              <item name="class" xsi:type="string">primary</item>
              <item name="url" xsi:type="string">*/*/edit</item>
              </item>
              </item>
              </argument>
              <dataSource name="vendorname_modulename_supplier_listing_data_source">
              <argument name="dataProvider" xsi:type="configurableObject">
              <argument name="class" xsi:type="string">VendornameModulenameUiComponentListingDataProvider</argument>
              <argument name="name" xsi:type="string">vendorname_modulename_supplier_listing_data_source</argument>
              <argument name="primaryFieldName" xsi:type="string">entity_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>
              <container name="listing_top">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="template" xsi:type="string">ui/grid/toolbar</item>
              </item>
              </argument>
              <bookmark name="bookmarks">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="storageConfig" xsi:type="array">
              <item name="namespace" xsi:type="string">vendorname_modulename_supplier_listing</item>
              </item>
              </item>
              </argument>
              </bookmark>
              <component name="columns_controls">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="columnsData" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns</item>
              </item>
              <item name="component" xsi:type="string">Magento_Ui/js/grid/controls/columns</item>
              <item name="displayArea" xsi:type="string">dataGridActions</item>
              </item>
              </argument>
              </component>
              <filterSearch name="fulltext">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
              <item name="chipsProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.listing_filters_chips</item>
              <item name="storageConfig" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
              <item name="namespace" xsi:type="string">current.search</item>
              </item>
              </item>
              </argument>
              </filterSearch>
              <filters name="listing_filters">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="columnsProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns</item>
              <item name="storageConfig" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
              <item name="namespace" xsi:type="string">current.filters</item>
              </item>
              <item name="templates" xsi:type="array">
              <item name="filters" xsi:type="array">
              <item name="select" xsi:type="array">
              <item name="component" xsi:type="string">Magento_Ui/js/form/element/ui-select</item>
              <item name="template" xsi:type="string">ui/grid/filters/elements/ui-select</item>
              </item>
              </item>
              </item>
              <item name="childDefaults" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.listing_filters</item>
              <item name="imports" xsi:type="array">
              <item name="visible" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.${ $.index }:visible</item>
              </item>
              </item>
              </item>
              </argument>
              </filters>
              <massaction name="listing_massaction">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
              <item name="indexField" xsi:type="string">entity_id</item>
              </item>
              </argument>
              <action name="delete">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="type" xsi:type="string">delete</item>
              <item name="label" xsi:type="string" translate="true">Delete</item>
              <item name="url" xsi:type="url" path="*/*/massDelete"/>
              <item name="confirm" xsi:type="array">
              <item name="title" xsi:type="string" translate="true">Delete items</item>
              <item name="message" xsi:type="string" translate="true">Are you sure you wan't to delete selected items?</item>
              </item>
              </item>
              </argument>
              </action>
              <action name="edit">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="type" xsi:type="string">edit</item>
              <item name="label" xsi:type="string" translate="true">Edit</item>
              <item name="callback" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns_editor</item>
              <item name="target" xsi:type="string">editSelected</item>
              </item>
              </item>
              </argument>
              </action>
              </massaction>
              <paging name="listing_paging">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="storageConfig" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
              <item name="namespace" xsi:type="string">current.paging</item>
              </item>
              <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
              </item>
              </argument>
              </paging>
              </container>
              <columns name="vendorname_modulename_supplier_columns">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="storageConfig" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
              <item name="namespace" xsi:type="string">current</item>
              </item>
              <item name="editorConfig" xsi:type="array">
              <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
              <item name="enabled" xsi:type="boolean">false</item>
              <item name="indexField" xsi:type="string">entity_id</item>
              <item name="clientConfig" xsi:type="array">
              <item name="saveUrl" xsi:type="url" path="*/*/inlineEdit"/>
              <item name="validateBeforeSave" xsi:type="boolean">false</item>
              </item>
              </item>
              <item name="childDefaults" xsi:type="array">
              <item name="fieldAction" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns_editor</item>
              <item name="target" xsi:type="string">startEdit</item>
              <item name="params" xsi:type="array">
              <item name="0" xsi:type="string">${ $.$data.rowIndex }</item>
              <item name="1" xsi:type="boolean">true</item>
              </item>
              </item>
              <item name="storageConfig" xsi:type="array">
              <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
              <item name="root" xsi:type="string">columns.${ $.index }</item>
              <item name="namespace" xsi:type="string">current.${ $.storageConfig.root }</item>
              </item>
              </item>
              </item>
              </argument>
              <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">entity_id</item>
              </item>
              </argument>
              </selectionsColumn>
              <column name="entity_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="title">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="filter" xsi:type="string">text</item>
              <item name="label" xsi:type="string" translate="true">Title</item>
              </item>
              </argument>
              </column>

              <column name="enabled" class="VendornameModulenameUiComponentListingColumnStatus" >
              <argument name="data" xsi:type="array">
              <item name="options" xsi:type="object">VendornameModulenameModelConfigSourceOptionsYesno</item>
              <item name="config" xsi:type="array">
              <item name="filter" xsi:type="string">select</item>
              <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/select</item>
              <item name="dataType" xsi:type="string">select</item>
              <item name="label" xsi:type="string" translate="true">Enabled</item>
              </item>
              </argument>
              </column>

              <column name="supplier_type" class="VendornameModulenameUiComponentListingColumnContacttype">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="filter" xsi:type="string">text</item>
              <item name="label" xsi:type="string" translate="true">Contact Type</item>
              </item>
              </argument>
              </column>

              <actionsColumn name="actions" class="VendornameModulenameUiComponentListingColumnContactActions">
              <argument name="data" xsi:type="array">
              <item name="config" xsi:type="array">
              <item name="indexField" xsi:type="string">entity_id</item>
              </item>
              </argument>
              </actionsColumn>
              </columns>
              </listing>




              share




























                0














                Here is component file which can be helpful. This is not the exact code I am using but similar to that.




                P.S: I have used this code in 2017 for magento 2.1




                 <?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">
                <argument name="data" xsi:type="array">
                <item name="js_config" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
                <item name="deps" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
                </item>
                <item name="spinner" xsi:type="string">vendorname_modulename_supplier_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 Contact</item>
                <item name="class" xsi:type="string">primary</item>
                <item name="url" xsi:type="string">*/*/edit</item>
                </item>
                </item>
                </argument>
                <dataSource name="vendorname_modulename_supplier_listing_data_source">
                <argument name="dataProvider" xsi:type="configurableObject">
                <argument name="class" xsi:type="string">VendornameModulenameUiComponentListingDataProvider</argument>
                <argument name="name" xsi:type="string">vendorname_modulename_supplier_listing_data_source</argument>
                <argument name="primaryFieldName" xsi:type="string">entity_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>
                <container name="listing_top">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="template" xsi:type="string">ui/grid/toolbar</item>
                </item>
                </argument>
                <bookmark name="bookmarks">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="storageConfig" xsi:type="array">
                <item name="namespace" xsi:type="string">vendorname_modulename_supplier_listing</item>
                </item>
                </item>
                </argument>
                </bookmark>
                <component name="columns_controls">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="columnsData" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns</item>
                </item>
                <item name="component" xsi:type="string">Magento_Ui/js/grid/controls/columns</item>
                <item name="displayArea" xsi:type="string">dataGridActions</item>
                </item>
                </argument>
                </component>
                <filterSearch name="fulltext">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
                <item name="chipsProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.listing_filters_chips</item>
                <item name="storageConfig" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                <item name="namespace" xsi:type="string">current.search</item>
                </item>
                </item>
                </argument>
                </filterSearch>
                <filters name="listing_filters">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="columnsProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns</item>
                <item name="storageConfig" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                <item name="namespace" xsi:type="string">current.filters</item>
                </item>
                <item name="templates" xsi:type="array">
                <item name="filters" xsi:type="array">
                <item name="select" xsi:type="array">
                <item name="component" xsi:type="string">Magento_Ui/js/form/element/ui-select</item>
                <item name="template" xsi:type="string">ui/grid/filters/elements/ui-select</item>
                </item>
                </item>
                </item>
                <item name="childDefaults" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.listing_filters</item>
                <item name="imports" xsi:type="array">
                <item name="visible" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.${ $.index }:visible</item>
                </item>
                </item>
                </item>
                </argument>
                </filters>
                <massaction name="listing_massaction">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
                <item name="indexField" xsi:type="string">entity_id</item>
                </item>
                </argument>
                <action name="delete">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="type" xsi:type="string">delete</item>
                <item name="label" xsi:type="string" translate="true">Delete</item>
                <item name="url" xsi:type="url" path="*/*/massDelete"/>
                <item name="confirm" xsi:type="array">
                <item name="title" xsi:type="string" translate="true">Delete items</item>
                <item name="message" xsi:type="string" translate="true">Are you sure you wan't to delete selected items?</item>
                </item>
                </item>
                </argument>
                </action>
                <action name="edit">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="type" xsi:type="string">edit</item>
                <item name="label" xsi:type="string" translate="true">Edit</item>
                <item name="callback" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns_editor</item>
                <item name="target" xsi:type="string">editSelected</item>
                </item>
                </item>
                </argument>
                </action>
                </massaction>
                <paging name="listing_paging">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="storageConfig" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                <item name="namespace" xsi:type="string">current.paging</item>
                </item>
                <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
                </item>
                </argument>
                </paging>
                </container>
                <columns name="vendorname_modulename_supplier_columns">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="storageConfig" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                <item name="namespace" xsi:type="string">current</item>
                </item>
                <item name="editorConfig" xsi:type="array">
                <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
                <item name="enabled" xsi:type="boolean">false</item>
                <item name="indexField" xsi:type="string">entity_id</item>
                <item name="clientConfig" xsi:type="array">
                <item name="saveUrl" xsi:type="url" path="*/*/inlineEdit"/>
                <item name="validateBeforeSave" xsi:type="boolean">false</item>
                </item>
                </item>
                <item name="childDefaults" xsi:type="array">
                <item name="fieldAction" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns_editor</item>
                <item name="target" xsi:type="string">startEdit</item>
                <item name="params" xsi:type="array">
                <item name="0" xsi:type="string">${ $.$data.rowIndex }</item>
                <item name="1" xsi:type="boolean">true</item>
                </item>
                </item>
                <item name="storageConfig" xsi:type="array">
                <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                <item name="root" xsi:type="string">columns.${ $.index }</item>
                <item name="namespace" xsi:type="string">current.${ $.storageConfig.root }</item>
                </item>
                </item>
                </item>
                </argument>
                <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">entity_id</item>
                </item>
                </argument>
                </selectionsColumn>
                <column name="entity_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="title">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="filter" xsi:type="string">text</item>
                <item name="label" xsi:type="string" translate="true">Title</item>
                </item>
                </argument>
                </column>

                <column name="enabled" class="VendornameModulenameUiComponentListingColumnStatus" >
                <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">VendornameModulenameModelConfigSourceOptionsYesno</item>
                <item name="config" xsi:type="array">
                <item name="filter" xsi:type="string">select</item>
                <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/select</item>
                <item name="dataType" xsi:type="string">select</item>
                <item name="label" xsi:type="string" translate="true">Enabled</item>
                </item>
                </argument>
                </column>

                <column name="supplier_type" class="VendornameModulenameUiComponentListingColumnContacttype">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="filter" xsi:type="string">text</item>
                <item name="label" xsi:type="string" translate="true">Contact Type</item>
                </item>
                </argument>
                </column>

                <actionsColumn name="actions" class="VendornameModulenameUiComponentListingColumnContactActions">
                <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                <item name="indexField" xsi:type="string">entity_id</item>
                </item>
                </argument>
                </actionsColumn>
                </columns>
                </listing>




                share


























                  0












                  0








                  0







                  Here is component file which can be helpful. This is not the exact code I am using but similar to that.




                  P.S: I have used this code in 2017 for magento 2.1




                   <?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">
                  <argument name="data" xsi:type="array">
                  <item name="js_config" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
                  <item name="deps" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
                  </item>
                  <item name="spinner" xsi:type="string">vendorname_modulename_supplier_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 Contact</item>
                  <item name="class" xsi:type="string">primary</item>
                  <item name="url" xsi:type="string">*/*/edit</item>
                  </item>
                  </item>
                  </argument>
                  <dataSource name="vendorname_modulename_supplier_listing_data_source">
                  <argument name="dataProvider" xsi:type="configurableObject">
                  <argument name="class" xsi:type="string">VendornameModulenameUiComponentListingDataProvider</argument>
                  <argument name="name" xsi:type="string">vendorname_modulename_supplier_listing_data_source</argument>
                  <argument name="primaryFieldName" xsi:type="string">entity_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>
                  <container name="listing_top">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="template" xsi:type="string">ui/grid/toolbar</item>
                  </item>
                  </argument>
                  <bookmark name="bookmarks">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="storageConfig" xsi:type="array">
                  <item name="namespace" xsi:type="string">vendorname_modulename_supplier_listing</item>
                  </item>
                  </item>
                  </argument>
                  </bookmark>
                  <component name="columns_controls">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="columnsData" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns</item>
                  </item>
                  <item name="component" xsi:type="string">Magento_Ui/js/grid/controls/columns</item>
                  <item name="displayArea" xsi:type="string">dataGridActions</item>
                  </item>
                  </argument>
                  </component>
                  <filterSearch name="fulltext">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
                  <item name="chipsProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.listing_filters_chips</item>
                  <item name="storageConfig" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                  <item name="namespace" xsi:type="string">current.search</item>
                  </item>
                  </item>
                  </argument>
                  </filterSearch>
                  <filters name="listing_filters">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="columnsProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns</item>
                  <item name="storageConfig" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                  <item name="namespace" xsi:type="string">current.filters</item>
                  </item>
                  <item name="templates" xsi:type="array">
                  <item name="filters" xsi:type="array">
                  <item name="select" xsi:type="array">
                  <item name="component" xsi:type="string">Magento_Ui/js/form/element/ui-select</item>
                  <item name="template" xsi:type="string">ui/grid/filters/elements/ui-select</item>
                  </item>
                  </item>
                  </item>
                  <item name="childDefaults" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.listing_filters</item>
                  <item name="imports" xsi:type="array">
                  <item name="visible" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.${ $.index }:visible</item>
                  </item>
                  </item>
                  </item>
                  </argument>
                  </filters>
                  <massaction name="listing_massaction">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
                  <item name="indexField" xsi:type="string">entity_id</item>
                  </item>
                  </argument>
                  <action name="delete">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="type" xsi:type="string">delete</item>
                  <item name="label" xsi:type="string" translate="true">Delete</item>
                  <item name="url" xsi:type="url" path="*/*/massDelete"/>
                  <item name="confirm" xsi:type="array">
                  <item name="title" xsi:type="string" translate="true">Delete items</item>
                  <item name="message" xsi:type="string" translate="true">Are you sure you wan't to delete selected items?</item>
                  </item>
                  </item>
                  </argument>
                  </action>
                  <action name="edit">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="type" xsi:type="string">edit</item>
                  <item name="label" xsi:type="string" translate="true">Edit</item>
                  <item name="callback" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns_editor</item>
                  <item name="target" xsi:type="string">editSelected</item>
                  </item>
                  </item>
                  </argument>
                  </action>
                  </massaction>
                  <paging name="listing_paging">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="storageConfig" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                  <item name="namespace" xsi:type="string">current.paging</item>
                  </item>
                  <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
                  </item>
                  </argument>
                  </paging>
                  </container>
                  <columns name="vendorname_modulename_supplier_columns">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="storageConfig" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                  <item name="namespace" xsi:type="string">current</item>
                  </item>
                  <item name="editorConfig" xsi:type="array">
                  <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
                  <item name="enabled" xsi:type="boolean">false</item>
                  <item name="indexField" xsi:type="string">entity_id</item>
                  <item name="clientConfig" xsi:type="array">
                  <item name="saveUrl" xsi:type="url" path="*/*/inlineEdit"/>
                  <item name="validateBeforeSave" xsi:type="boolean">false</item>
                  </item>
                  </item>
                  <item name="childDefaults" xsi:type="array">
                  <item name="fieldAction" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns_editor</item>
                  <item name="target" xsi:type="string">startEdit</item>
                  <item name="params" xsi:type="array">
                  <item name="0" xsi:type="string">${ $.$data.rowIndex }</item>
                  <item name="1" xsi:type="boolean">true</item>
                  </item>
                  </item>
                  <item name="storageConfig" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                  <item name="root" xsi:type="string">columns.${ $.index }</item>
                  <item name="namespace" xsi:type="string">current.${ $.storageConfig.root }</item>
                  </item>
                  </item>
                  </item>
                  </argument>
                  <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">entity_id</item>
                  </item>
                  </argument>
                  </selectionsColumn>
                  <column name="entity_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="title">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="filter" xsi:type="string">text</item>
                  <item name="label" xsi:type="string" translate="true">Title</item>
                  </item>
                  </argument>
                  </column>

                  <column name="enabled" class="VendornameModulenameUiComponentListingColumnStatus" >
                  <argument name="data" xsi:type="array">
                  <item name="options" xsi:type="object">VendornameModulenameModelConfigSourceOptionsYesno</item>
                  <item name="config" xsi:type="array">
                  <item name="filter" xsi:type="string">select</item>
                  <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/select</item>
                  <item name="dataType" xsi:type="string">select</item>
                  <item name="label" xsi:type="string" translate="true">Enabled</item>
                  </item>
                  </argument>
                  </column>

                  <column name="supplier_type" class="VendornameModulenameUiComponentListingColumnContacttype">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="filter" xsi:type="string">text</item>
                  <item name="label" xsi:type="string" translate="true">Contact Type</item>
                  </item>
                  </argument>
                  </column>

                  <actionsColumn name="actions" class="VendornameModulenameUiComponentListingColumnContactActions">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="indexField" xsi:type="string">entity_id</item>
                  </item>
                  </argument>
                  </actionsColumn>
                  </columns>
                  </listing>




                  share













                  Here is component file which can be helpful. This is not the exact code I am using but similar to that.




                  P.S: I have used this code in 2017 for magento 2.1




                   <?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">
                  <argument name="data" xsi:type="array">
                  <item name="js_config" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
                  <item name="deps" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
                  </item>
                  <item name="spinner" xsi:type="string">vendorname_modulename_supplier_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 Contact</item>
                  <item name="class" xsi:type="string">primary</item>
                  <item name="url" xsi:type="string">*/*/edit</item>
                  </item>
                  </item>
                  </argument>
                  <dataSource name="vendorname_modulename_supplier_listing_data_source">
                  <argument name="dataProvider" xsi:type="configurableObject">
                  <argument name="class" xsi:type="string">VendornameModulenameUiComponentListingDataProvider</argument>
                  <argument name="name" xsi:type="string">vendorname_modulename_supplier_listing_data_source</argument>
                  <argument name="primaryFieldName" xsi:type="string">entity_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>
                  <container name="listing_top">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="template" xsi:type="string">ui/grid/toolbar</item>
                  </item>
                  </argument>
                  <bookmark name="bookmarks">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="storageConfig" xsi:type="array">
                  <item name="namespace" xsi:type="string">vendorname_modulename_supplier_listing</item>
                  </item>
                  </item>
                  </argument>
                  </bookmark>
                  <component name="columns_controls">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="columnsData" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns</item>
                  </item>
                  <item name="component" xsi:type="string">Magento_Ui/js/grid/controls/columns</item>
                  <item name="displayArea" xsi:type="string">dataGridActions</item>
                  </item>
                  </argument>
                  </component>
                  <filterSearch name="fulltext">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing_data_source</item>
                  <item name="chipsProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.listing_filters_chips</item>
                  <item name="storageConfig" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                  <item name="namespace" xsi:type="string">current.search</item>
                  </item>
                  </item>
                  </argument>
                  </filterSearch>
                  <filters name="listing_filters">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="columnsProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns</item>
                  <item name="storageConfig" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                  <item name="namespace" xsi:type="string">current.filters</item>
                  </item>
                  <item name="templates" xsi:type="array">
                  <item name="filters" xsi:type="array">
                  <item name="select" xsi:type="array">
                  <item name="component" xsi:type="string">Magento_Ui/js/form/element/ui-select</item>
                  <item name="template" xsi:type="string">ui/grid/filters/elements/ui-select</item>
                  </item>
                  </item>
                  </item>
                  <item name="childDefaults" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.listing_filters</item>
                  <item name="imports" xsi:type="array">
                  <item name="visible" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.${ $.index }:visible</item>
                  </item>
                  </item>
                  </item>
                  </argument>
                  </filters>
                  <massaction name="listing_massaction">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
                  <item name="indexField" xsi:type="string">entity_id</item>
                  </item>
                  </argument>
                  <action name="delete">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="type" xsi:type="string">delete</item>
                  <item name="label" xsi:type="string" translate="true">Delete</item>
                  <item name="url" xsi:type="url" path="*/*/massDelete"/>
                  <item name="confirm" xsi:type="array">
                  <item name="title" xsi:type="string" translate="true">Delete items</item>
                  <item name="message" xsi:type="string" translate="true">Are you sure you wan't to delete selected items?</item>
                  </item>
                  </item>
                  </argument>
                  </action>
                  <action name="edit">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="type" xsi:type="string">edit</item>
                  <item name="label" xsi:type="string" translate="true">Edit</item>
                  <item name="callback" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns_editor</item>
                  <item name="target" xsi:type="string">editSelected</item>
                  </item>
                  </item>
                  </argument>
                  </action>
                  </massaction>
                  <paging name="listing_paging">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="storageConfig" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                  <item name="namespace" xsi:type="string">current.paging</item>
                  </item>
                  <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
                  </item>
                  </argument>
                  </paging>
                  </container>
                  <columns name="vendorname_modulename_supplier_columns">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="storageConfig" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                  <item name="namespace" xsi:type="string">current</item>
                  </item>
                  <item name="editorConfig" xsi:type="array">
                  <item name="selectProvider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns.ids</item>
                  <item name="enabled" xsi:type="boolean">false</item>
                  <item name="indexField" xsi:type="string">entity_id</item>
                  <item name="clientConfig" xsi:type="array">
                  <item name="saveUrl" xsi:type="url" path="*/*/inlineEdit"/>
                  <item name="validateBeforeSave" xsi:type="boolean">false</item>
                  </item>
                  </item>
                  <item name="childDefaults" xsi:type="array">
                  <item name="fieldAction" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.vendorname_modulename_supplier_columns_editor</item>
                  <item name="target" xsi:type="string">startEdit</item>
                  <item name="params" xsi:type="array">
                  <item name="0" xsi:type="string">${ $.$data.rowIndex }</item>
                  <item name="1" xsi:type="boolean">true</item>
                  </item>
                  </item>
                  <item name="storageConfig" xsi:type="array">
                  <item name="provider" xsi:type="string">vendorname_modulename_supplier_listing.vendorname_modulename_supplier_listing.listing_top.bookmarks</item>
                  <item name="root" xsi:type="string">columns.${ $.index }</item>
                  <item name="namespace" xsi:type="string">current.${ $.storageConfig.root }</item>
                  </item>
                  </item>
                  </item>
                  </argument>
                  <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">entity_id</item>
                  </item>
                  </argument>
                  </selectionsColumn>
                  <column name="entity_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="title">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="filter" xsi:type="string">text</item>
                  <item name="label" xsi:type="string" translate="true">Title</item>
                  </item>
                  </argument>
                  </column>

                  <column name="enabled" class="VendornameModulenameUiComponentListingColumnStatus" >
                  <argument name="data" xsi:type="array">
                  <item name="options" xsi:type="object">VendornameModulenameModelConfigSourceOptionsYesno</item>
                  <item name="config" xsi:type="array">
                  <item name="filter" xsi:type="string">select</item>
                  <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/select</item>
                  <item name="dataType" xsi:type="string">select</item>
                  <item name="label" xsi:type="string" translate="true">Enabled</item>
                  </item>
                  </argument>
                  </column>

                  <column name="supplier_type" class="VendornameModulenameUiComponentListingColumnContacttype">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="filter" xsi:type="string">text</item>
                  <item name="label" xsi:type="string" translate="true">Contact Type</item>
                  </item>
                  </argument>
                  </column>

                  <actionsColumn name="actions" class="VendornameModulenameUiComponentListingColumnContactActions">
                  <argument name="data" xsi:type="array">
                  <item name="config" xsi:type="array">
                  <item name="indexField" xsi:type="string">entity_id</item>
                  </item>
                  </argument>
                  </actionsColumn>
                  </columns>
                  </listing>





                  share











                  share


                  share










                  answered 8 mins ago









                  SarvagyaSarvagya

                  76021638




                  76021638






























                      draft saved

                      draft discarded




















































                      Thanks for contributing an answer to Magento Stack Exchange!


                      • Please be sure to answer the question. Provide details and share your research!

                      But avoid



                      • Asking for help, clarification, or responding to other answers.

                      • Making statements based on opinion; back them up with references or personal experience.


                      To learn more, see our tips on writing great answers.




                      draft saved


                      draft discarded














                      StackExchange.ready(
                      function () {
                      StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f158564%2fhow-to-create-grid-using-ui-component-for-custom-eav-model%23new-answer', 'question_page');
                      }
                      );

                      Post as a guest















                      Required, but never shown





















































                      Required, but never shown














                      Required, but never shown












                      Required, but never shown







                      Required, but never shown

































                      Required, but never shown














                      Required, but never shown












                      Required, but never shown







                      Required, but never shown







                      Popular posts from this blog

                      What other Star Trek series did the main TNG cast show up in?

                      Berlina muro

                      Berlina aerponto