Hide filter row in Agrid

Question

I am unable to hide floating filter row.

you would notice an empty line even though there are no filters enabled.

Demo at : https://plnkr.co/edit/6bGd5RHKuI9Th1cN

The Source of demo is same as default demo at https://www.ag-grid.com/javascript-grid-floating-filters/ with the only exception of below line added after the columnDefs variable declaration code, to hide the columns

this.columnDefs.forEach(c => (c.filter = false));

Or is it a Ag-grid issue?

Issue image:

Any thoughts?

Also found that setting the gridoptions.floatingfilter property = false cause this issue when you have set the floatingfilter property = true directly in the markup — Ram

Paritosh Paritosh · Accepted Answer · 2020-03-10T12:51:42

As per documentation: Floating Filters

Floating Filters are an additional row under the column headers where the user will be able to see and optionally edit the filters associated to each column.

Floating filters depend on and coordinate with the main column filters.

Hence, when you set [floatingFilter]="true" at grid level, the additional row will be displayed. However, as you've set filter = false for every row, the row will remain empty.

If you'd like to hide the row, you'll have set the property as per this plunk: https://plnkr.co/edit/AriPNpPsWs0zuISI

this.floatingFilter = false;

    <ag-grid-angular
      #agGrid
      ...
      [floatingFilter]="floatingFilter"
      ...
    ></ag-grid-angular>

Hide filter row in Agrid

1 Answers