Kinetic grid groups expand all/collapse all

Hey all, long time reader, first-ish time posting. I came up with this solution while trying to make the Kinetic/browser based version of Epicor work more like classic for grouping in grids (specifically in Fulfillment workbench, but it should work anywhere) where, in classic, you use to be able to expand or collapse all of the grouped rows in a grid. It is based on the Kendo grid behavior here: Expand and Collapse All Detail Rows - Kendo UI for jQuery Data Grid - Kendo UI for jQuery.
Essentially, you can setup grouping on the data in the grid and then add custom action data or buttons and events for expand/collapse all. In the event related to the action data, you’ll need to set 2 properties on the grid object, gridModel.groupsInitiallyExpanded to true or false depending on if you want to expand or collapse and also set gridModel.expandedGroupRowsKey to null either way.

image
image

Thanks to Jose for inspiring me to post this at the EpiUsers event.

7 Likes

Bookmarked. Thank you!

(post deleted by author)