[ExtJs]Grid合计(三)
前言
今天又有朋友给发邮件询问Grid合计的问题,看的应该是我较早的文章,这里汇总一下并提供第三种合计的方法。
正文
一、方法一
通过修改JsonReader并使用插件GroupSummary,文章:ExtJs Grid 合计 [Ext | GridPanel | GridSummary]
二、方法二
先在后台 (C#服务端)统计好,然后添加DataTable(多返回一行数据),然后序列号成JSON返回给客户端,文章:ExtJs 备忘录(7)—— GirdPanl表格(三) [ 统计|查看、修改单行记录 ]
三、方法三
3.1 方法说明
直接在客户端统计,动态的修改Grid(js 操作)。
3.2 实现代码
{
var sum = 0;
grid.store.each(function(record){
sum += Number(record.data.money);
});
var n = grid.getStore().getCount();// 获得总行数
var p = new Ext.data.Record({
id: '总计:',
money:sum
});
grid.store.insert(n, p);// 插入到最后一行
}
//加载数据
store.load({
callback: function(r,options,success) {
if(!success)
alert("数据加载失败!");
GridSum(grid);
}
});
代码说明:
a). store为Ext.data.Store,取数据部分代码在这里就省略了;grid是Ext.grid.GridPanel,同上。
b). 注意GridSum不要写到load方法之后,否则数据还没加载完就动态插入一行,会看见闪一下就没有的现象,一定要注意加载完成后再调用统计的方法。
四、总结和比较
4.1 第一种方法很明显是最复杂的,基本可以被淘汰。
4.2 第二种方法比较不错,擅长于写后台代码的比较喜欢,虽然麻烦点,但是非常灵活,在分页的情况下能统计一页也能统计所以的数据。
4.3 第三种方法最简单,适合统计一页数据,即务须做分页的表格。
4.4 注意这三个版本例子的ExtJs版本号可能不一样,第二种应该是最通用的。
结束
最好不如最合适来得实际 :)
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· 字符编码:从基础到乱码解决
· Open-Sora 2.0 重磅开源!