How to hide sort order indicator in Ag-Grid?

Question

I'm using AgGrid and ag-grid-angular 15.0.0

All my columns are sortable. Ag-grid prints a number into each header, indicating the sort order. How to hide this? I'm using suppressMultiSort = true, as I wanna sort by a single column only.

EDIT:

If only 1 column is sortable, the numbers are not printed. But if more than 1 can be sorted, agGrid displays those numbers in the headers..

Furthermore, once I click any of the headers to trigger sorting, the numbers disappear..

Any help would be greatly appreciated.

Thanks in advance!

Answer 1

I can see there are many questions (and confusions you are having :) ) in you post.

1. "If only 1 column is sortable, the numbers are not printed. But if more than 1 can be sorted, agGrid displays those numbers in the headers.."

If you want to enable multisort and don't want to see the numbers indicating sort orders, then you can do it with CSS.

Check this plunk: ag-grid Multi Column Sort - hide sortorder numbers

.ag-header-cell-label .ag-header-icon.ag-sort-order {
  display: none
}

2. "Furthermore, once I click any of the headers to trigger sorting, the numbers disappear.."

ag-grid sorting on multiple columns works when you click on column with Ctrl pressed.
If multi-column sort is already there, and if you click on any other column without Ctrl, then the older column sorting vanished, and it is replaced with the last column you have clicked.

3. If you want to disable multi-sort, you need to set below attribute on ag-grid element

[suppressMultiSort]="true"

4. multiSortKey can be changed - you need to mention it as the below attribute

multiSortKey = "ctrl";

You can see in the Plunk I provided.

Hope this helps.