汇总——DataGrid系列

第一种：拿到数据后，控件自己来汇总

 1 @*…………省略无关部分*@
 2 
 3 @(Html.DevExtreme().DataGrid<Model>()
 4 　　…………
 5 　　.ID("gridMetting")
 6 
 7 　　.KeyExpr("ReportUserGroupId")
 8 　　.DataSource(d => d.Mvc().Controller("MettingReport").LoadAction("Get").Key("Id"))
 9 　　.Summary(s => s.TotalItems(items => {
10 　　　　items.AddFor(m => m.GroupTotalCount)
11 　　　　　　.DisplayFormat("总数：{0}")
12 　　　　　　.ValueFormat(Format.FixedPoint)
13 　　　　　　.SummaryType(SummaryType.Sum);
14 　　　　items.AddFor(m => m.GroupPartInCount)
15 　　　　　　.DisplayFormat("总数：{0}")
16 　　　　　　.ValueFormat(Format.FixedPoint)
17 　　　　　　.SummaryType(SummaryType.Sum);
18 　　})
19 　　@*…………省略无关部分*@
20 
21 )

第二种：使用API返回来的汇总数据

 1 @(Html.DevExtreme().DataGrid<Model>()　　
 2 　　.ID("gridMetting")
 3 　　.KeyExpr("ReportUserGroupId")　　
 4 )
 5 
 6 <script>
 7 var dataGrid;
 8 $(function () {
 9 　　dataGrid = $("#gridMetting").dxDataGrid("instance");
10 　　loadDataGrid({});
11 
12 });
13 
14 function loadDataGrid(data) {
15 　　loadPanel.show();
16 　　dataGrid.option("noDataText", "正在加载...");
17 
18 　　sendRequest('@Url.RouteUrl(new { controller = "MettingReport", action = "GetStatisticsInfo" })', "GET", data)
19 　　　　.then(function (r) {
20 　　　　　　if (r.data) {
21 　　　　　　　　dataGrid.option({
22 　　　　　　　　　　"dataSource": r.data,  // 集合
23 　　　　　　　　　　"summary": {
24 　　　　　　　　　　　　totalItems: [
25 　　　　　　　　　　　　　　{
26 　　　　　　　　　　　　　　　　column: "GroupTotalCount",
27 　　　　　　　　　　　　　　　　displayFormat: "总数：" + r.summary[0]
28 
29 　　　　　　　　　　　　　　},
30 　　　　　　　　　　　　　　{
31 　　　　　　　　　　　　　　　　column: "GroupPartInCount",
32 　　　　　　　　　　　　　　　　displayFormat: "总数：" + r.summary[1]
33 　　　　　　　　　　　　　　}]
34 　　　　　　　　　　　}
35 　　　　　　　　});
36 　　　　　　}
37 　　　　　　else {
38 　　　　　　　　dataGrid.option("noDataText", "没有数据");
39 　　　　　　}
40 　　　　});
41 }
42 
43 function sendRequest(url, method, data) {
44 　　method = method || "GET";
45 　　return $.ajax(url, {
46 　　　　method: method,
47 　　　　data: data,
48 　　　　cache: false,
49 　　　　xhrFields: { withCredentials: true }
50 　　});
51 }
52 </script>