123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>The source code</title>
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
- <style type="text/css">
- .highlight { display: block; background-color: #ddd; }
- </style>
- <script type="text/javascript">
- function highlight() {
- document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
- }
- </script>
- </head>
- <body onload="prettyPrint(); highlight();">
- <pre class="prettyprint lang-js"><span id='Ext-grid-feature-Summary'>/**
- </span> * This feature is used to place a summary row at the bottom of the grid. If using a grouping,
- * see {@link Ext.grid.feature.GroupingSummary}. There are 2 aspects to calculating the summaries,
- * calculation and rendering.
- *
- * ## Calculation
- * The summary value needs to be calculated for each column in the grid. This is controlled
- * by the summaryType option specified on the column. There are several built in summary types,
- * which can be specified as a string on the column configuration. These call underlying methods
- * on the store:
- *
- * - {@link Ext.data.Store#count count}
- * - {@link Ext.data.Store#sum sum}
- * - {@link Ext.data.Store#min min}
- * - {@link Ext.data.Store#max max}
- * - {@link Ext.data.Store#average average}
- *
- * Alternatively, the summaryType can be a function definition. If this is the case,
- * the function is called with an array of records to calculate the summary value.
- *
- * ## Rendering
- * Similar to a column, the summary also supports a summaryRenderer function. This
- * summaryRenderer is called before displaying a value. The function is optional, if
- * not specified the default calculated value is shown. The summaryRenderer is called with:
- *
- * - value {Object} - The calculated value.
- * - summaryData {Object} - Contains all raw summary values for the row.
- * - field {String} - The name of the field we are calculating
- *
- * ## Example Usage
- *
- * @example
- * 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'
- * }]
- * });
- */
- Ext.define('Ext.grid.feature.Summary', {
-
- /* Begin Definitions */
-
- extend: 'Ext.grid.feature.AbstractSummary',
-
- alias: 'feature.summary',
-
- /* End Definitions */
-
- <span id='Ext-grid-feature-Summary-method-getFragmentTpl'> /**
- </span> * Gets any fragments needed for the template.
- * @private
- * @return {Object} The fragments
- */
- getFragmentTpl: function() {
- // this gets called before render, so we'll setup the data here.
- this.summaryData = this.generateSummaryData();
- return this.getSummaryFragments();
- },
-
- <span id='Ext-grid-feature-Summary-method-getTableFragments'> /**
- </span> * Overrides the closeRows method on the template so we can include our own custom
- * footer.
- * @private
- * @return {Object} The custom fragments
- */
- getTableFragments: function(){
- if (this.showSummaryRow) {
- return {
- closeRows: this.closeRows
- };
- }
- },
-
- <span id='Ext-grid-feature-Summary-method-closeRows'> /**
- </span> * Provide our own custom footer for the grid.
- * @private
- * @return {String} The custom footer
- */
- closeRows: function() {
- return '</tpl>{[this.printSummaryRow()]}';
- },
-
- <span id='Ext-grid-feature-Summary-method-getPrintData'> /**
- </span> * Gets the data for printing a template row
- * @private
- * @param {Number} index The index in the template
- * @return {Array} The template values
- */
- getPrintData: function(index){
- var me = this,
- columns = me.view.headerCt.getColumnsForTpl(),
- i = 0,
- length = columns.length,
- data = [],
- active = me.summaryData,
- column;
-
- for (; i < length; ++i) {
- column = columns[i];
- column.gridSummaryValue = this.getColumnValue(column, active);
- data.push(column);
- }
- return data;
- },
-
- <span id='Ext-grid-feature-Summary-method-generateSummaryData'> /**
- </span> * Generates all of the summary data to be used when processing the template
- * @private
- * @return {Object} The summary data
- */
- generateSummaryData: function(){
- var me = this,
- data = {},
- store = me.view.store,
- columns = me.view.headerCt.getColumnsForTpl(),
- i = 0,
- length = columns.length,
- fieldData,
- key,
- comp;
-
- for (i = 0, length = columns.length; i < length; ++i) {
- comp = Ext.getCmp(columns[i].id);
- data[comp.id] = me.getSummary(store, comp.summaryType, comp.dataIndex, false);
- }
- return data;
- }
- });</pre>
- </body>
- </html>
|