CODEWITHSUNDEEP
ag-grid
Serge Salamatin
Serge Salamatin

Reputation: 43

A problem with keeping column width in ag-Grid

I have own algorithm for calculating column width and want have it unchangeable, but ag-Grid resize it! After searching docs for all available methods to achieve needed results, but not have. I prepare this pure minimal html file to illustrate situation. Does anyone know the right way?

</div>
<script charset="utf-8">
'use strict'

let gridOptions = {
  defaultColDef: {
    editable: true,
    sortable: true,
    flex: 1,
    minWidth: 20,
    maxWidth: 400,
    filter: true,
    resizable: false,
    suppressSizeToFit: true,
    suppressResize: true,
    headerClass: 'fixed-size-header',
  },
  columnDefs: [
  {
    "field": "id",
    "width": 80
  },
  {
    "field": "name",
    "width": 350
  },
  {
    "field": "created_at",
    "width": 140
  },
  {
    "field": "updated_at",
    "width": 140
  }
],
rowData: [
  {"id": 1,
    "name": "Mathematics",
    "created_at": "2020-04-22 10:32:13 UTC",
    "updated_at": "2020-04-22 10:32:13 UTC"
  },
  {"id": 2,
    "name": "Algebra",
    "created_at": "2020-04-22 10:32:13 UTC",
    "updated_at": "2020-04-22 10:32:13 UTC"
  } ]};

document.addEventListener('DOMContentLoaded', () => {
  const eGridDiv = document.querySelector('#GridDiv');
  new agGrid.Grid(eGridDiv, gridOptions);
});

</script>

Upvotes: 2

Views: 6025

Answers (1)

ViqMontana
ViqMontana

Reputation: 5688

Your problem is you are using flex: 1. The definition for setting the flex property is:

Used instead of width when the goal is to fill the remaining empty space of the grid

Remove the flex: 1 from your defaultColDef.

See here.

Upvotes: 10

Related Questions