Menu
I want to make the filter icon visible permanently in the Ag-grid. The current behaviour is such that the filter icons in the columns only become visible when I hover across the column headings .
This is an example of the column definition that I am using.
this.ColumnDefs=[{"headerName":"Interface","field":"interfaceName",sortingOrder: ['asc','desc', 'null'],width:120,cellStyle:{'text-align': "left"},unSortIcon: true},
{"headerName":"Status","field":"status",sortingOrder: ['asc','desc', 'null'],width:120,cellStyle:{'text-align': "left"},unSortIcon: true},
{"headerName":"Runtime","field":"lastDate",sortingOrder: ['asc','desc', 'null'],width:150,cellStyle:{'text-align': "left"},unSortIcon: true}]
How can I achieve this result?
418
gridOptions = { floatingFilter: true columnDefs:[{ ... suppressMenu: true, floatingFilterComponentParams: {suppressFilterButton:true} ... }] } Save this answer.
You can use the icons property of the column definition to set a custom icon for sort on a column level or icons property of gridOptions to apply for all columns. If defined in both the grid options and column definitions, the column definition will get used. Also you must import fontawesome css file for this to work.
You can pin columns by setting the pinned attribute on the column definition to either 'left' or 'right' .
The correct answer is here to set suppressMenuHide in gridOptions or directly on HTML [suppressMenuHide]="true"
suppressMenuHide Set to true to always show the column menu button, rather than only showing when the mouse is over the column header.
149
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
