`
dzqlhh
  • 浏览: 61185 次
社区版块
存档分类
最新评论

Extjs grid增加合计行

阅读更多

      这里讲诉的合计方法是在前台增加合计行的方法,不包含后台计算合计的方法。

如果我们需要在grid的第一行增加一行合计的时候,只需要将grid的store数据进行循环,将需要合计的列一次叠加后,返回一个合计值,将合计值赋给定义好的record,然后将此record插入到grid内。代码如下:

var p = new Ext.data.Record({fields : ['name', 'num']});//定义一行要插入的record

 var sum=0;

 Ext.getCmp('listgrid').store.each(function(record){ 
      if(record.data.num!=null)

                   sum+=Number(record.data.num);//叠加需要合计的列值返回给sum
      });     

               p.set('name','合计');//给新行赋值,合计放到name列中
               p.set('num,sum);//合计值放到num列中

     }

Ext.getCmp('listgrid').store.insert(0, p);//将赋值后的新行插入到grid的第一行中

分享到:
评论

相关推荐

    给Extjs的GridPanel增加“合计”行

    这篇博文“给Extjs的GridPanel增加‘合计’行”将指导我们如何实现这一功能。 首先,我们需要理解EXTJS的GridPanel结构。GridPanel由Store(数据存储)、ColumnModel(列模型)和View(视图)等主要部分组成。在...

    ExtJs Grid选择行

    在ExtJs框架中,Grid组件是一种非常常用的展示数据表格的方式,它提供了丰富的功能,包括数据的排序、分页、过滤以及行选择等。在实际应用中,经常需要根据用户交互来判断Grid中的行是否被选中,以便进行下一步的...

    ext grid 合计行

    找了半天,结果在extjs的老家找到一个前辈写的代码,可以在grid上面加上合计, <br>但是却只能合计grid里面的数据,但是我们平常一般是只显示20行或者30行,这样的合计就没有什么意义,我们的合计数据是单独从...

    ExtJS grid过滤操作

    - **实时更新**:当用户更改过滤条件时,Grid会即时更新视图,只显示匹配的数据行。 - **性能考虑**:对于大数据量,本地过滤可能影响性能,需权衡用户体验与数据量。 4. **高级过滤** - **复合过滤**:使用`...

    EXTJS grid导出EXCEL文件

    1. **EXTJS Grid组件**:EXTJS Grid是EXTJS的核心组件之一,它允许开发者创建可分页、可排序、可过滤的数据表格。Grid可以与各种数据源(如JSON、XML或内存中的数组)配合使用,并通过Store对象进行数据的加载和管理...

    ExtJs grid多选时获取选中的所有值

    ### ExtJs Grid 多选及获取选中值详解 #### 一、背景介绍 在Web应用开发中,ExtJs 是一款非常强大的JavaScript框架,它能够帮助开发者快速构建复杂的用户界面。其中,Grid Panel(简称 Grid)是ExtJs中最常用的一个...

    ExtJs6 导出excel(包含分组、分组合计行、二重表头)

    在ExtJS6中,数据网格可以配置分组、分组合计行以及二重表头,这些都是增强数据展示和理解的重要特性。分组功能允许将数据按照特定字段进行分类,使数据更有条理;分组合计行则是在每个分组下显示该组数据的总计,...

    ExtJS GRID单元格合并

    ExtJS GRID是一款强大的JavaScript数据网格组件,用于展示和操作大量结构化数据。在ExtJS 4.0版本中,Grid提供了单元格合并的功能,这在处理复杂数据展示时非常有用,比如汇总信息或者创建表头合并。下面我们将深入...

    extjs grid示例代码

    ExtJS Grid是Sencha ExtJS框架中的一个核心组件,它用于构建数据驱动的表格视图。Grid组件在Web应用中广泛使用,因为它提供了强大的数据展示、排序、分页、筛选和编辑功能。以下是对`ExtJS Grid`示例代码的详细解析...

    extjs grid

    3. **行编辑**:EXTJS Grid支持行内编辑,用户可以直接在表格中修改数据,提供了一种直观的数据输入方式。通过配置`editable`属性和`editors`,可以指定哪些列是可编辑的。 4. **分页**:Grid可以通过`...

    EXTJS Grid总结例子

    EXTJS Grid提供了丰富的交互功能,如行选择、行编辑、行删除等。Selection Model支持多种模式,如SINGLE、MULTI和SIMPLE,通过`selType`配置选择。 八、高级特性 EXTJS Grid还支持行拖放、锁定列、列重排、嵌套Grid...

    extjs grid数据导出excel文件

    这包括将数据转换为二维数组,每一行代表一个Grid记录,每一列对应记录的一个字段。 4. **创建并写入工作簿**:利用SheetJS创建一个新的工作簿对象,然后将转换后的数据添加到新的工作表中。 5. **生成Excel文件**...

    Extjs grid 中文排序问题修正

    在EXTJS开发中,我们经常会遇到使用Grid组件展示数据的情况,特别是当数据包含中文字符时,可能会遇到排序问题。EXTJS Grid默认的排序机制对于英文字符处理得较好,但对于中文字符,由于编码和比较规则的不同,可能...

    Extjs grid分页1

    ExtJS Grid 分页是Web应用中数据展示的重要组成部分,它允许用户高效地浏览大量数据而无需一次性加载所有记录。在本文中,我们将深入探讨ExtJS Grid的分页功能及其实现方式。 首先,ExtJS Grid是一种强大的...

    extjs grid 多表头插件

    ExtJS Grid是一款强大的数据展示组件,常用于构建复杂的Web应用程序中的数据网格。多表头插件是ExtJS Grid的一个重要特性,它允许我们创建具有多层次、复杂结构的表头,以便更好地组织和呈现数据。在ExtJS Grid中,...

    Extjs Grid 扩展实例

    2. **行编辑**:为了实现增删改查的功能,我们可以集成ExtJS的行编辑插件(`Ext.grid.plugin.RowEditing`)。这允许用户直接在Grid的行内进行编辑,通过点击单元格激活编辑模式,完成后点击保存按钮提交更改。 3. *...

    extjs中设置grid默认行高及换行

    Extjs 中想改变grid 行高,如果只是简单的设置了height的值是可以实现grid 的行高,但是如果使用了插件:rowexpander ,最出现新的问题。 感兴趣的朋友可以试试的。 此文档可以解决你的烦恼,为了找到资源下载,...

    Extjs4.2 Grid filter Demo 表格过滤实验

    这是利用sencha cmd 生成的GridFilterDemo工程中的app和build文件夹,其余文件过大并且与主题无关,因此未包含。具体方法,请参看我的博客: 《Extjs4.2 Grid Filter Feature 表格过滤特性》

    Extjs grid分页多选记忆功能

    很多同事在用extjs grid做分页的时候,往往会想用grid的多选功能来实现导出Excel之类的功能(也就是所谓的多选记忆功能),但在选选择下一页的时候 上一页选中的已经清除 这是因为做分页的时候又向服务器请求了分页...

    Extjs Grid 操作大全

    根据提供的文件信息以及标题与描述,本文将详细探讨Extjs Grid的操作大全,特别是关于如何获取Grid中的各种值以及如何添加各种点击事件。 ### Extjs Grid 操作大全 #### 一、Extjs Grid简介 Extjs 是一个用...

Global site tag (gtag.js) - Google Analytics