Different Kendo grid data sources when applying grouping

Question

I have a Kendo grid with the following declaration:

 @(Html.Kendo().Grid<AgencyAutomation.DomainLayer.ViewModels.InvoiceDetailViewModel>()
              .Name("invoiceDetailGrid")
             .BindTo((IEnumerable<AgencyAutomation.DomainLayer.ViewModels.InvoiceDetailViewModel>)@ViewBag.InvoiceDetails)
              .Columns(columns =>
              {
                  //
                  columns.Bound(p => p.AccountId).Hidden();
                  columns.Bound(p => p.StakeHolderId).Hidden();
                  columns.Bound(p => p.CommissionTypeId).Hidden();
                  columns.Bound(p => p.BillDescription).Hidden();
                  columns.Bound(p => p.GroupNo).Hidden().ClientGroupHeaderTemplate("<span  style='float:right'><button id='btnGroupEdit' onclick='ShowGroupEdit(#=value#)'  class='btn btn-primary round_blue'><i class='fa fa-edit'></i>&nbsp;Edit</button></span>");
                  columns.Bound(p => p.StakeHolderDesc).Filterable(true).Sortable(true).Title("Stakeholder").Groupable(true);
                  columns.Bound(p => p.StakeholderName).Filterable(true).Sortable(true).Title("Stakeholder Name");
                  columns.Bound(p => p.AmountType).Filterable(true).Sortable(true).Title("Amount Type");
                  columns.Bound(p => p.CommissionTypeDescription).Filterable(true).Sortable(true).Title("Commission Type");
                  columns.Bound(p => p.CommissionValue).Filterable(true).Sortable(true).Title("Commission Value").ClientTemplate("#if (CommissionValue > 0){#<div>#=CommissionValue#</div>#} else {#<div></div>#}#");
                  columns.Bound(p => p.PlanCode).Filterable(true).Sortable(true).Title("Plan Code");
                  columns.Bound(p => p.Amount).Filterable(true).Sortable(true).Title("Amount").Format("{0:c2}").ClientFooterTemplate("").ClientGroupFooterTemplate("<div> $#=sum#</div>").Format("{0:c2}");
                  columns.Bound(p => p.GroupNo).Hidden();

                 // columns.Bound(p => p.InvoiceDetailId).ClientTemplate(gridRowIcons).Title("").Filterable(false).Width(90);

              })
             .Pageable(pageable => pageable.ButtonCount(5).PageSizes(true))
              .Filterable()

              .Selectable(selectable => selectable
              .Mode(GridSelectionMode.Single))
              .Navigatable()
              .Groupable(p => p.Enabled(false))
              .DataSource(dataSource => dataSource


              .Ajax()
              .Aggregates(aggregates =>
            {
                aggregates.Add(p => p.Amount).Sum();
            })
                     .Group(groups => groups.Add(p => p.GroupNo))
                  .Model(model =>
                  {
                      model.Id(p => p.InvoiceDetailId);
                  }))
              .Sortable()
              .Filterable()
        )

Based on the grouping based on “GroupNo,” I want to change this particular section of the popup, delete the existing lines for that group, and replace it with new Lineitems. Without grouping, I can easily access the data source and manipulate the data. But when I access the grid using grouping, its length of the data source returns only the number of groups available with the member attribute containing the field in which the grouping is applied.

I tried to delete the group with the following command: grid.dataSource.group([])Or grid.dataSource.group(""), but it does not change the data source.

? , , ,

Answer 1

, , , . , -. , .

var grid = $("#gridAdminConfig").data("kendoGrid");
var groupedData = grid.dataSource.data();
var data = [];

//enumerate the groups and grab the actual items
for (var i = 0; i < groupedData.length; i++) {
 for (var j = 0; j < groupedData[i].items.length; j++) {
    data.push(groupedData[i].items[j]);
 }
}