• 汇总——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>
  • 相关阅读:
    推荐一款酷炫闪烁的告警按钮
    设计模式之单例模式(懒汉式单例、饿汉式单例、登记式单例)
    JDK1.8新特性-Lambda表达式
    博客园自定义样式(去广告、公告栏加头像、按钮样式)
    java月考题JSD1908第二次月考(含答案和解析)
    Java面试题_第四阶段
    Java面试题_第三阶段(Spring、MVC、IOC、AOP、DI、MyBatis、SSM、struts2)
    Java面试题_第二阶段(Servlet、HTTP、Session、JSP、 Ajax、Filter、JDBC、Mysql、Spring)
    Java面试题_第一阶段(static、final、面向对象、多线程、集合、String、同步、接口、GC、JVM)
    Oracle排名函数(Rank)实例详解
  • 原文地址:https://www.cnblogs.com/xiaonanmu/p/15234920.html
Copyright © 2020-2023  润新知