Forums Ignite UI for Angular
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Andrew A
30
Sort column by click on header, not exactly on sort icon
posted

As seen from the example below it's possible - to sort column by click on row header, not on sort icon. It works even with commented 

<ng-template igxHeader>.

https://stackblitz.com/edit/igx-grid-column-header-event-handling-issue-when-movable-dfwfyj?file=src/app/grid/grid-sample-pinning/grid-pinning.component.html

But I can't figure out how to achieve this in my grid. Are there any special settings to sort column by click at any region of column header?

Parents
  • 740
    Verified Answer
    Offline posted

    Hello Andrew,

    Thank you for contacting Infragistics Community!

    A behavioral change in the way sorting is triggering on columns in the igxGrid’s was introduced with IgniteUI for Angular version 9.1 release.  From this version on, sorting is performed by clicking exclusively on the sorting indicator. In case the columns should be sorted via clicking on the entire header additional logic should be implemented. Please take a look at the following sample I have prepared for you. As you can observe, I have templated the headers and attached a pointerdown listeners (This event is suitable for the scenario when Moving feature is enabled. In case you are not using Moving feature the click of the header can be handled). Then in the onHeaderClick method I check if the column has been already sorted or not and I change the sorting direction accordingly.

    If this sample is not an accurate demonstration of what you are trying to achieve please feel free to modify it and send it back to me for further investigation.

    Looking forward to hearing from you.

    Best Regards,
    Martin Evtimov
    Entry Level Software Developer
    Infragistics, Inc.

Reply Children