grid onSortChange doesn't catch current sort

[Hervé]

Hello all,

 

I have a simple grid with a default sort defined on the redux store. It works perfectly fine on load but when I try to change de the sortdirection by clicking on the arrow, the eventHandler onSortChange catch an empty array instead of the current sort. 

you can see it on the 3 files attached.

 

Any id why the e.sort array is empty ?

 

Thank you.

 

[Krissy]

Hi Hervé,

The way the sort works is in the following order:

ascending (asc) => descending (desc) => unsort (returns an empty array)

The onSortChange event catches the new sort that is being applied. In your example, since the initial sorting is done in descending order, the next click will not change the direction, rather it will unsort. This is why an empty array is returned. On the next click, the items will be sorted in ascending order.

There are two possible approaches here:

1. If you want to be able to change from ascending to descending order only, you can set the allowUnsort property to false, which will disable the unsorting. Keep in mind, that this means that this will make the column always be sorted in some direction and the sorting cannot be removed.

There is a demo on how to achieve this at the following page in our documentation: 
https://www.telerik.com/kendo-react-ui/components/grid/sorting/#toc-customize-sorting 


2. If you want to keep the unsorting option, but change the order of the sorting, you can customize how the sort state is being updated based on the received array from event.sort.

For example, when an empty array is received from event.sort, the sort state is updated with a sort in ascending order and vice-versa. This will change the sorting order to desc => asc => unsort.

Hope one of these approaches is suitable for your application.

Regards,
Krissy
Progress Telerik

[Hervé]

Hi Krissy,

 

It helps a lot. I am now able to catch the sort array and I understand the behaviour.

 

Thanks for your help.