还记得在4.0.7之前的版本中,要在gridpanel中加一个合计栏是多么麻烦啊,4.0出现后,一句话就搞定
直接copy官方的
Ext.onReady(function () { Ext.define('TestResult', { extend: 'Ext.data.Model', fields: ['student', { name: 'mark', type: 'int' }] }); Ext.create('Ext.grid.Panel', { 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;
}
简化了不少工作,但是有一点小遗憾,观察Ext.grid.feature.Summary这个类我们会发现,这个统计是在store下去找数据,当store带有分页,它统计的会是当前页的数据,如果你想统计的是所有记录数据,那只能通过其它方法了。