Collapse rows on grouping

[Mohammad]

I was wondering how the kendo grid could be configured such that the grouped rows would be collapsed rather than the expanded as in the default behaviour. I found this workaround, but the problem with that is that it uses the grid's databound event to collapse all rows, and this inadvertently tampers with the scrolling feature, basically the user is then unable to scroll further than the first page. So does the grid expose a OnGrouped() event or something similar which can be exploited to collapse the rows?

The behaviour i desire is similar to the devexpress grid, drag the country column down, and drag it back up to group, notice how the rows are collapsed.

Any other workaround to achieve this beaviour? Thanks.

[Chad]

I too am interested in this!

[Chad]

I found this solution works,,,but haven't tried it with scrolling.

Add this to the grid definition:

.Events(events => events.DataBound("collapseGroupRows"))

Here is the js function to collapse:

function collapseGroupRows() {

    var grid = $("#NAME OF GRID HERE").data("kendoGrid");

    grid.collapseGroup(grid.tbody.find(">tr.k-grouping-row"));

    $('tr[role*="row"]').hide();

}