Jakub Siuda
Jakub Siuda

Reputation: 227

Ag-grid hiding rows

Is there any implemented functionality to conditionally hide rows?

I instantiate them like this:

let rows = [
    { name: "Adam", isVisible: true },
    { name: "Bert", isVisible: true },
    { name: "Carl", isVisible: false }
];

for(let row of rows)
  row["height"] = row.isVisible ? 25 : 0;

this.rowData = rows;

And then I provide this function to set the row height:

this.gridOptions.getRowHeight = (params) => {
    return params.data.height;
}

This is not a perfect solution, especially because if the grid ends with a row of height 0 it shows that row anyway (with the height of 4px or so)

Upvotes: 4

Views: 27001

Answers (2)

Mostafa Ibrahim
Mostafa Ibrahim

Reputation: 29

As a workaround for the 4px issue when setting row height to 0, i suggest you also use

gridOptions.getRowStyle = function(params) {
            //some filter
            return { 'display': 'none' };
        }

Upvotes: 2

Jonathan Naim
Jonathan Naim

Reputation: 229

I think the best way would be to filter the data based on the property isVisible of the object.

An implementation could be:

gridOptions.isExternalFilterPresent = () => {return true;}
gridOptions.doesExternalFilterPass = (node) => {
    return gridOptions.api.getValue("isVisible", node)
}

if the datamodel data changes then you just need to call gridOptions.api.onFilterChanged()

Upvotes: 12

Related Questions