CODEWITHSUNDEEP
javascriptheightrowag-grid
valangar
valangar

Reputation: 171

Specify min height for rows while preserving auto height feature - Ag-grid

I want to specify a minimum height for each ag-grid row to 40px and allow for dynamic height for any row that exceeds 40px.

      this.gridOptions = {
        /* rowHeight : 40, */
        headerHeight: 100,
        pagination: true,
        enableSorting: true,
        enableColResize: true,
        rowDeselection: true,
        suppressHorizontalScroll: false,
        autoHeight: true
      };

gridOptions.autoHeight let's me dynamically change the height, but assigning something like gridOptions.rowHeight or using the getRowHeight(params) to set a default minimum height overrides the autoHeight. Is there a way to resolve this?

Upvotes: 6

Views: 6463

Answers (1)

valangar
valangar

Reputation: 171

Managed to resolve this issue, posting the answer here for anyone else who may have the same problem:

There were a few things I needed to change:

  1. I was using a version (13.1.2) of ag-grid that didn't seem to be supporting the autoHeight feature. Updated ag-grid to version 18.1.2 and ag-grid-vue to 18.1.0 (I am using a Vue.js framework).
  2. I was using autoHeight option incorrectly. I needed to use autoHeight: true; while configuring each column that determined the height of a row, rather than in gridOptions.

These steps adjusted the height of the rows based on the content.

  1. Adding rowHeight: 40px; in gridOptions, set a minimum height for the rows after the autoHeight was applied.

Upvotes: 2

Related Questions