Grid Column In Percentage and Pixel

[Nagendra Gupta]

Dear Team,

Our requirement is grid column in percentage  as well as in pixel also.

1. Sometime we want column in percentage only.

2. Sometime we want column in pixel and percentage both.

3. Sometime we want column in only pixel.

[Pavithra Subramaniyam]

Hi Nagendra Gupta,

Thanks for contacting Syncfusion support.

Our EJ2 Grid column width accepts both pixel and per percentage values. So, you can set the pixel value as a number or percentage with ‘%’ to achieve your requirement.

{ field: 'OrderID', headerText: 'Order ID', width: '20%', textAlign: 'Right' },

 

{ field: 'OrderID', headerText: 'Order ID', width: 120, textAlign: 'Right' },

 

https://ej2.syncfusion.com/documentation/api/grid/column/#width

If you are facing any issues with the column width assigning, please share the Grid code and screenshot of the issue for a better solution.

Please get back to us if you need further assistance on this.

Regards,

Pavithra S

[Nagendra Gupta]

Hi Pavithra Subramaniyam ,

As per your reply my columns level problem resolved. Now I can put column width both Percentage as well as in Pixel.

Now, I want scrolling in grid and I am giving columns width more than from screen width size but column width is adjustabling according to screen width size that's why I am not able to make scrolling left to right in bottom.

Below is my code which I have used.

  <ejs-grid #grid

            height="100%"

            [dataSource]="data"

            [columns]="columns"

            [allowTextWrap]="false"

            rowHeight="25"

            [enableVirtualization]="true"

            [allowSorting]="allowSorting"

            [sortSettings]="sortOptions"

            [allowMultiSorting]="true"

            locale='en-IN'

            (load)="OnGridLoad($event)"

            allowExcelExport=true

            allowPdfExport=true>

  </ejs-grid>

[Pavithra Subramaniyam]

Hi Nagendra Gupta,

We are working on the reported scenario “Grid is not scrollable while setting both percentage and pixels column width”. So, we will update the further details on or before November 11^th , 2022. Until then we appreciate your patience.

Regards,

Pavithra S

[Pavithra Subramaniyam]

Hi Nagendra Gupta,

Thanks for your patience.

While setting the “column.width” as both pixel and percentage, the pixel width columns will be set as per the assigned width and the percentage columns will be adjusted based on the parent width. This is the behavior of the HTML table too. So, this is the default behavior of the Grid component.

Please get back to us if you need further assistance on this.

Regards,

Pavithra S