Kendo Grid Grouping

[Jiyo]

I'm using kendo react grid grouping feature to group datas in grid.The problem is i'm not able to expand or collapse the group.

 

Here is my code....

https://stackblitz.com/edit/react-ryuhdv?file=index.js

[Stefan]

Hello, Jiyo,

Thank you for your example.

The issue occurs as the expandField prop is not set. This points to the field in the data which will determine if the item will be expanded or not:

https://www.telerik.com/kendo-react-ui/components/grid/api/GridProps/#toc-expandfield

This is the updated example:

https://stackblitz.com/edit/react-vjntwc?file=index.js

I hope this is helpful.

Regards,
Stefan
Progress Telerik

[Jiyo]

Hiii,

can you please take a look into the following example which uses kendo grid grouping.In this example i'm not able to expand or collapse the group.

Here is the link.........https://stackblitz.com/edit/react-vfxqxq?file=index.js

[Stefan]

Hello, Jiyo,

This occurs because when updating the expanded state using the event item, this is directly updating the specific object. Then when the process method is used inside render, this is creating a new instance of the data array when the expanded value is lost.

As in the example the process method is used inside render, this means that every time a new instance is created.

event.dataItem.expanded

I updated the example to use the dataResult inside render and the expand and collapse are working. Still, after the process method is called for example after the grouping is changed the current expand and collapsed state will be lost.

I can suggest keeping the expanded items inside an additional array and applying the expanded value after any data operations.

As this is not a straight forward task, we have planned to update the process method, so it can apply the expanded state as well when processing the data.

 

Regards,

Author nickname

Progress Telerik