CODEWITHSUNDEEP
ag-grid
Lawliet Wu
Lawliet Wu

Reputation: 43

How to modify or delete the maxWidth of a column?

eg:

const colDefs =   [{ field: 'country', maxWidth:100,}]

when the grid ready,i use the setColumnDefs to change maxWidth, but it didn't take effect.

function changeMaxWidth(){
  const colDefs = gridOptions.api.getColumnDefs()
  colDefs[0].maxWidth = 130 
  gridOptions.api.setColumnDefs(colDefs)
}

this is example: plunker

Upvotes: 2

Views: 1260

Answers (3)

Pontus Ekengren
Pontus Ekengren

Reputation: 77

Might not be interesting but also look into column "flex" as it solves a lot of autosizing-issues that people have: https://www.ag-grid.com/documentation/javascript/column-sizing/

Upvotes: 0

Lawliet Wu
Lawliet Wu

Reputation: 43

If you are like me just want to not exceed the maxWidth when using api.autoSizeAllColumns(), other times (for example, drag and drop column width) may exceed the limit, you can refer to my approach.

.ag-center-cols-container > span:last-child{
  max-width: 248px;
}

This style will limit the size of the adaptive width when api.autoSizeAllColumns()

Upvotes: 0

Kaki Master Of Time
Kaki Master Of Time

Reputation: 1614

MaxWidth can not be changed that way via the setColumnDefs. from the docs, only the framework bound attributes would change using the setColumnDefs, which probably means the headerframework or cellRendererFramework as those would return reactJs or angular components.

The only attribute related to the maxWidth that you can change dynamically is width which will set the current width.(docs)

You can also use api.sizeColumnsToFit() to try and fit the available table width, or api.autoSizeAllColumns() to size the columns based on their content (both these methods would take consideration of width, maxWidth, and minWidth).

Upvotes: 1

Related Questions