As the ag-Grid sorting , setting the opt.enablesorting true, this will allow header clicks and show sort icons and sort within the grid.
However, I prefer to set api.setSortModel manually in a popup mdoel window rather than header clicks. So I want header clicks was disabled by some ways. I have tried some ways to fix it, but any of them worked.
eg I setted the opt.enablesorting false, header clicks sort was be disabled. But meantime, api.setSortModel didn't work as well.
eg I used headerCellRenderer to custom headerCellTemplate, but also failed. Because the up down arrow was shown up when I click the header.
Are there any ways to help me to fix it?
There is no as such event for column header click, so that you can handle that. But I Found one hack by using column header template default template is:
<div class="ag-header-cell">
<div id="agResizeBar" class="ag-header-cell-resize"></div>
<span id="agMenu" class="ag-header-icon ag-header-cell-menu-button"></span>
<div id="agHeaderCellLabel" class="ag-header-cell-label">
<span id="agSortAsc" class="ag-header-icon ag-sort-ascending-icon"></span>
<span id="agSortDesc" class="ag-header-icon ag-sort-descending-icon"></span>
<span id="agNoSort" class="ag-header-icon ag-sort-none-icon"></span>
<span id="agFilter" class="ag-header-icon ag-filter-icon"></span>
<span id="agText" class="ag-header-cell-text"></span>
</div>
</div>
keep same struture if you want but remove id="agHeaderCellLabel" from third div to make it as
<div class="ag-header-cell">
<div id="agResizeBar" class="ag-header-cell-resize"></div>
<span id="agMenu" class="ag-header-icon ag-header-cell-menu-button"></span>
<div class="ag-header-cell-label">
<span id="agSortAsc" class="ag-header-icon ag-sort-ascending-icon"></span>
<span id="agSortDesc" class="ag-header-icon ag-sort-descending-icon"></span>
<span id="agNoSort" class="ag-header-icon ag-sort-none-icon"></span>
<span id="agFilter" class="ag-header-icon ag-filter-icon"></span>
<span id="agText" class="ag-header-cell-text"></span>
</div>
</div>
this will prevent the click event binding
in the newer version (Version 27.2.0 is the one i'm using), remove ref="eLabel" in div
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.