Question

我有以下网格

@(Html.Kendo().Grid<ComponentViewModel>().Name("valueGrid")
  .Columns(columns =>
  {
      //columns.Command(cmd => cmd.Edit()).Width(75);
      columns.Bound(r => r.Name).Title("Value Name");
      columns.Bound(r => r.Description).Title("Value Description");
      columns.Bound(r => r.Weight).ClientFooterTemplate("Total: #=sum#");
      columns.Command(cmd => cmd.Destroy()).Width(32);
  })
  .HtmlAttributes(new {@class = "v-table"})
  .Editable(editable => editable.Mode(GridEditMode.InCell))
  .Filterable()
  .Sortable()
  .Events(events =>
  {
      events.SaveChanges("VerifyWeights");
      events.Save("UpdateTotal");
  })
  .ToolBar(toolbar =>
  {
      toolbar.Create().Text("Add Value");
      toolbar.Save();
  })
  .DataSource(dataSource => dataSource
    .Ajax()
    .Model(model =>
    {
        model.Id(r => r.ComponentID);
        model.Field(r => r.ComponentTypeID).DefaultValue(Model);
    })
    .Aggregates(aggregates => aggregates.Add(p => p.Weight).Sum())
    //.Batch(true)
    .PageSize(10)
    .Read(r => r.Action("ReadValue", "Component"))
    .Create(c => c.Action("CreateValue", "Component"))
    .Destroy(d => d.Action("Delete", "Component"))
    .Update(u => u.Action("Update", "Component"))
)
)

function UpdateTotal() {
    var total = $("#valueGrid .k-footer-template").text().split(":")[1];
    var totalWeight = 0;
    var theGridData = $('#valueGrid').data("kendoGrid").dataSource.data();
    $(theGridData).each(function (index, item) {
        totalWeight += item.Weight;
    });
    // This doesn't work //$("#valueGrid .k-footer-template").text(totalWeight)
    how do I set the total based on the added, edited, removed weights of the table?
}

我希望在用户添加，修改或删除时，“权重”列页脚会更新“总计”。我正在捕获SaveEvent，但我不知道如何根据表中的当前值更新页脚。我希望这发生在客户端。

Answer 1

这就是我最终解决问题的方法。

//This was the first part of the answer
columns.Bound(r => r.Weight).ClientFooterTemplate("Total: =sum#").FooterHtmlAttributes(new {@id="totalWeight"});  

function updateTotal(e) {
    updateComponentTotal('#valueGrid', e);
}

function updateComponentTotal(gridSelector, e) {
  e.model.set('Weight', e.values.Weight);

  var totalWeight = 0;
  var theGridData = $(gridSelector).data("kendoGrid").dataSource.data();
  $(theGridData).each(function (index, item) {
    totalWeight += item.Weight;
  });
  $('#totalWeight').text("Total: " + totalWeight); //This was the second part of the answer
}

如果网格使用批处理，如何更新Kendo网格中的聚合值？

1 个答案: