ag-grid: row autoHeight doesn't work when using a Cell Renderer

I’m submitting a … (check one with “x”)

[x] bug report => see 'Providing a Reproducible Scenario'
[] feature request => do not use Github for feature requests, see 'Customers of ag-Grid'
[] support request => see 'Requesting Community Support'

Providing a Reproducible Scenario if you comment out cellRenderer on the column definition, autoHeight works as excepted https://embed.plnkr.co/d0dELGfRax8UPEJ8ujTu/

Current behavior autoHeight seems to be ignored when the cell renderer is set

Expected behavior autoHeight to be applied

Please tell us about your environment:

  • Operating system: CentoOS Linux 7

  • ag-Grid version: 20.2.0

  • Browser: Chrome 72
  • Language: all

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 8
  • Comments: 24 (1 by maintainers)

Most upvoted comments

I saw the ticket was added to the v21 release so I updated the dependencies in the plunkr and unfortunately it seems whatever was changed didn’t fix this issue as this still isn’t working in v21.1.0 https://embed.plnkr.co/rFy43whVrSIguf4Taaac/

you call use api.resetRowHeights() to reset the table of height

Hey @Paul6552 @AmareshB, I think we have the same problems. I opened a PR that may fix the issue. Could you give this a shot and see if it fixes your problem?

No guarantees 😅

I had to downgrade to v21, which has other problems 😕

not sure if you guy are aware of this but it doesn’t work on v22, i created a plunker to demonstrate this

https://next.plnkr.co/edit/iSfcgJH7oIxqd1QY

image

the second one has custom rendered but it won’t use autoheight at ll

I’m having the same problem. The autoHeight calculation seems to never use the cellRenderer when creating the dummy elements to measure height.

This is a regression from 20.2.0.

Hello,

I am still experiencing a similar issue with Vue3. My framework cell renderers are not taking full advantage of the autoHeight. I run into a UX issue when trying to enter the cell editor with a double click as the entire cell does not react to this input. In the screenshots below you’ll see only half of the right cell is selected (double clicking below that selected area wont trigger the cell editor)… as for the left cell it’s displayed on two lines and the selection indicator is around the entire cell: Screen Shot 2021-11-30 at 8 58 13 AM Screen Shot 2021-11-30 at 8 58 28 AM

Both are actually using the same vue cell render but with computed properties and conditional vue rendering based on the column field and defaultColDef of autoHeight = true. Any suggestions to fix this issue?

Any help is much appreciated!

-Jose

This seems to be fixed in the latest release (21.1.0) if you are using cellRenderer as described above. However, we’re using cellRendererFramework to render things with React and it’s not auto sizing the content in that case.