11

Using 2.1.3, is there a way to hide an entire column from a UI component admin grid? I found Magento2 Add css class to admin ui grid column, and that hides the column, but not the column header (misaligning the grid columns).

1
  • From your response below it sounds like you're trying to show/hide an order grid column based on the currently logged in admin user. Did you ever find a solution for that?
    – Louis B.
    Commented Aug 9, 2021 at 8:39

3 Answers 3

8

use <item name="visible" xsi:type="boolean">false</item> in the config node of data argument when declaring column

eg.

<column name="created_at">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="resizeEnabled" xsi:type="boolean">false</item>
            <item name="filter" xsi:type="string">dateRange</item>
            <item name="sorting" xsi:type="string">desc</item>
            <item name="label" xsi:type="string" translate="true">Created at</item>
            <item name="sortOrder" xsi:type="number">120</item>
            <item name="visible" xsi:type="boolean">false</item>
        </item>
    </argument>
</column>

the only issue that the filter won't showing until you switch the column back to visible

4
  • Thanks @Mammouth, but this looks like a config setting - I want to be able to change the visibility based on the users role, so it would have to check it in code.
    – dbcn
    Commented Jun 16, 2017 at 17:18
  • acl wasn't created for this ... but for mimic something similar just extend/override Magento_Ui/view/base/web/js/grid/columns/column.js with your business logic
    – Mammouth
    Commented Jun 20, 2017 at 10:33
  • otehrwise I think would be good to open a new thread to your current problem (hiding column by user role settings), because this one already solved
    – Mammouth
    Commented Jun 20, 2017 at 10:43
  • @Mammouth, But the filter should visible, only can we hide from column? Commented Feb 20, 2020 at 11:36
5

You can try with <item name="componentDisabled" xsi:type="boolean">true</item>

For example:

Vendor/Module/view/adminhtml/ui_component/product_form.xml

<field name="backorders">
    <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="componentDisabled" xsi:type="boolean">true</item>
            </item>
    </argument>
</field>
1
  • Thanks @Khoa, but I want to display the column depending on the user's permissions, so I want the column there, but to start hidden.
    – dbcn
    Commented Feb 7, 2017 at 16:41
2

Add below code in your ui xml to remove columns

<column name="name_of_column">
          <argument name="data" xsi:type="array">
               <item name="config" xsi:type="array">
               <item name="componentDisabled" xsi:type="boolean">true</item>
           </item>
      </argument>
</column>
<field name="name_of_column">
          <argument name="data" xsi:type="array">
               <item name="config" xsi:type="array">
               <item name="componentDisabled" xsi:type="boolean">true</item>
           </item>
      </argument>
</field>

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.