How to multiple select a 'grouped' group of rows in a grid

[adamhughes]

In 'Grouped' grids .. is there a way to say 'select all items in one Group?

[Aleksandar]

Hi Adam,

You can implement such functionality using the GroupHeaderTemplate, adding a checkbox and selecting all the items in the group, as such functionality is not available out of the box:

@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Select();
...
        columns.Bound(p => p.UnitsInStock)
            .ClientGroupHeaderTemplate("<input type='checkbox' class='cbx k-checkbox k-checkbox-md k-rounded-md'/> Units In Stock: #= value # (Count: #= count#)")
            .ClientFooterTemplate("<div>Min: #= min #</div><div>Max: #= max #</div>");
    })
...
    .Selectable(s=>s.Mode(GridSelectionMode.Multiple)
            .Type(GridSelectionType.Row))
    .Events(ev=>ev.DataBound("onDataBound"))
)

<script>
    function onDataBound(){
        $(".cbx").change(function(){
            var grid = $("#grid").getKendoGrid();
            var currentGroupRow = $(this).closest(".k-grouping-row");
            // Select the items in the current group
            grid.select(currentGroupRow.nextUntil(".k-grouping-row", ":not('.k-group-footer')"));
            })
    }
</script>

The above example demonstrates how to select the group rows upon click of a header row checkbox. Feel free to extend the example to handle unchecking and deselecting of the group rows. Keep in mind, however, that the above example will select rows on the current page, but not items from the group that might be on the next page/pages as the logic demonstrated relies on visible, rendered rows.  

I hope this helps. 

Regards,
Aleksandar
Progress Telerik