How to make the column width of ag-grid responsive based on row data?

Issue

Columns in ag-grid:

columnsDefs = [
   {
    headerName: 'Name',
    field: 'name'
   },
   {
    headerName: 'Age',
    field: 'age'
   },
   {
    headerName: 'Description',
    field: 'description'
   } 
];

The characters length in description can vary. For example, some row might have just 10 characters and some row might have 50 characters.
If I set the column width then, if description has much longer length of characters then some of characters will not be shown.

api.sizeColumnsToFit() will scale the columns to fit the available width of the screen.
I wanted to achieve the column ‘Description’ width to be responsive based on the its row data.

Solution

You can use columnApi method : autoSizeColumns

autoSizeColumn(colKey) Auto-sizes a column based on its contents.

Answered By – un.spike

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published