admin
管理员
管理员
  • UID1
  • 粉丝2
  • 关注2
  • 发帖数339
  • 社区居民
  • 忠实会员
  • 原创写手
阅读:5600回复:0

extjs 表格增加合计

楼主#
更多 发布于:2014-05-14 21:29
分享到:
参考网址 http://www.cnblogs.com/luluping/archive/2011/11/09/2243776.html
Ext.onReady(function () {
        Ext.define('TestResult', {
            extend: 'Ext.data.Model',
            fields: ['student', {
                name: 'mark',
                type: 'int'
            }]
        });
        Ext.create('Ext.grid.Panel', {
            width: 200,
            height: 140,
            renderTo: document.body,
            features: [{
                ftype: 'summary'
            }],
            store: {
                model: 'TestResult',
                data: [{
                    student: 'Student 1',
                    mark: 84
                }, {
                    student: 'Student 2',
                    mark: 72
                }, {
                    student: 'Student 3',
                    mark: 96
                }, {
                    student: 'Student 4',
                    mark: 68
                }]
            },
            columns: [{
                dataIndex: 'student',
                text: 'Name',
                summaryType: 'count',
                summaryRenderer: function (value, summaryData, dataIndex) {
                    return Ext.String.format('{0} student{1}', value, value !== 1 ? 's' : '');
                }
            }, {
                dataIndex: 'mark',
                text: 'Mark',
                summaryType: 'average'
            }]
        });
    });
summaryType(统计类型)共有五种 count\sum\min\max\average
如果希望改变这一行的样式:
 .x-grid-row-summary .x-grid-cell-inner {
            font-weight      : bold;
            font-size        : 14px;
            background-color : #ffd800;
}
extjs 4.2 例子
var grid = Ext.create('Ext.grid.Panel', {
    "xtype": "gridpanel", "title": "金额统计", "store": store,
    features: [
        {
            ftype: 'summary'//Ext.grid.feature.Summary表格汇总特性
        }
    ],
    // 栏目
    "columns": [
        {
            "dataIndex": "money",
            "text": "金额",
            field: {
                xtype: 'numberfield'
            },
            summaryType: 'sum',//总计
            summaryRenderer: function (value, summaryData, dataIndex) {
                return '总计:' + value;
            }
        }
    ]
});
在store里面定义money 类型为int {name: 'money', type: 'int'},
游客

返回顶部