6

I have added an admin grid using UI component in my custom module. Now I want to change the column width of admin grid.

This is the code that I am using for adding column in admin grid :

 <column name="product_title">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <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="filter" xsi:type="string">text</item>
            <item name="label" xsi:type="string" translate="true">Title</item>
            <item name="sortOrder" xsi:type="number">20</item>
        </item>
    </argument>
</column>

Please Help me

1

it may help just giving you example to use just like in new version of magento used.

<block class="Magento\Backend\Block\Widget\Grid\Column" as="package">
                        <arguments>
                            <argument name="header" xsi:type="string" translate="true">Design</argument>
                            <argument name="type" xsi:type="string">options</argument>
                            <argument name="options" xsi:type="options" model="Magento\Framework\View\Design\Theme\Label\Options"/>
                            <argument name="width" xsi:type="string">150px</argument>
                            <argument name="index" xsi:type="string">design</argument>
                        </arguments>
                    </block>

you can look width as argument in xml

<argument name="width" xsi:type="string">150px</argument>

Also if you have to follow strict ui components you can use Resize component.

example from source link

<column name="creation_time">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="resizeEnabled" xsi:type="boolean">true</item>
            <item name="resizeDefaultWidth" xsi:type="string">60</item>
        </item>
    </argument>
</column>

hope it will work for you

1

You can use resizeDefaultWidth to change column with, required resizeEnabled = false,

Example code here.

<actionsColumn name="actions" class="Magento\Search\Ui\Component\Listing\Column\SynonymActions">
            <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">107</item>
                </item>
            </argument>
        </actionsColumn>

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.