【新特性速递】表格多行合计支持

sanshi

FineUIPro/Mvc/Core的下个版本（v6.1.0），我们对表格控件进行了增强，可以显示多个合计行了。


先来看下显示效果：




和单合计行相比，前台代码没用任何变化，重点在后台代码，我们新增了一个SummaryDataArray属性。


上述示例的后台关键代码如下所示：

1. private void OutputSummaryData(DataTable source)
   
2. {
   
3.     JArray summaryArray = new JArray();
   
4. 
   
5.     // 分页合计
   
6.     DataTable table = GetPagedDataTable(Grid1.PageIndex, Grid1.PageSize);
   
7.     summaryArray.Add(CalcSummaryRow(table, "当前页合计："));
   
8. 
   
9.     // 全部合计
   
10.     summaryArray.Add(CalcSummaryRow(DataSourceUtil.GetDataTable2(), "全部合计："));
    
11. 
    
12.     Grid1.SummaryDataArray = summaryArray;
    
13. }
    
14. 
    
15. private JObject CalcSummaryRow(DataTable source, string title)
    
16. {
    
17.     float donateTotal = 0.0f;
    
18.     float feeTotal = 0.0f;
    
19.     foreach (DataRow row in source.Rows)
    
20.     {
    
21.         donateTotal += Convert.ToInt32(row["Donate"]);
    
22.         feeTotal += Convert.ToInt32(row["Fee"]);
    
23.     }
    
24. 
    
25. 
    
26.     JObject summary = new JObject();
    
27.     summary.Add("major", title);
    
28.     summary.Add("fee", feeTotal.ToString("F2"));
    
29.     summary.Add("donate", donateTotal.ToString("F2"));
    
30.    
    
31.     return summary;
    
32. }

复制代码

可以看到，我们只需新建一个 JArray 对象，需要几个合计行，就插入几条数据。



需要注意的一点，向合计行对象添加的数据中：

1. summary.Add("donate", donateTotal.ToString("F2"));

复制代码

其中的 donate 对应的是列的 ColumnID 属性（而不是DataField属性），看下前台的声明标签（属性值是严格区分大小写的）：

1. 
   
2. <f:BoundField Width="100px" DataField="Donate" ColumnID="donate" HeaderText="捐赠金额" />

复制代码

官网示例已更新：

• FineUIPro：https://pro.fineui.com/
• FineUIMvc：https://mvc.fineui.com/
• FineUICore：https://core.fineui.com/
• FineUICore （Razor Pages & Tag Helpers）：https://pages.fineui.com/
• F.js：https://js.fineui.com/
  

现在加入【三石和他的朋友们】星球，下载FineUIPro/Mvc/Core（基础版）：https://fineui.com/fans/