PDA

View Full Version : Ext.ux.GroupSummary



niterain
26 Aug 2009, 10:31 PM
I am trying to implement the Group Summary, but the data isn't showing up. This is what I have so far (What am I doing wrong):

Ext.onReady(function(){

Ext.QuickTips.init();

var xg = Ext.grid;

var reader = new Ext.data.JsonReader({
idProperty: 'task_id',
fields: [
{name: 'day_time', type: 'string'},
{name: 'raws', type: 'int'},
{name: 'uniques', type: 'int'},
{name: 'sent_emails', type: 'int'},
{name: 'signups', type: 'int'},
{name: 'signup_amount', type: 'float'},
{name: 'sales', type: 'int'},
{name: 'sales_amount', type: 'float'},
{name: 'funds_raised', type: 'float'},
{name: 'chargebacks', type: 'int'},
{name: 'chargeback_amount', type: 'float'},
{name: 'refunds', type: 'int'},
{name: 'refund_amount', type: 'float'},
{name: 'returns', type: 'int'},
{name: 'return_amount', type: 'float'},
{name: 'project', type: 'string'},
{name: 'task_id', type: 'int'}
]

});

// define a custom summary function
Ext.ux.grid.GroupSummary.Calculations['totalCost'] = function(v, record, field){
return v + (record.data.estimate * record.data.rate);
};

// utilize custom extension for Group Summary
var summary = new Ext.ux.grid.GroupSummary();

var grid = new xg.EditorGridPanel({
ds: new Ext.data.GroupingStore({
reader: reader,
// use local data
data: app.grid.dummyData,
sortInfo: {field: 'day_time', direction: 'ASC'},
groupField: 'project'
}),
columns: [
{header: 'Date', width: 160, sortable: true, dataIndex: 'day_time' , id: 'day_time'},
{header: 'Raws', width: 160, sortable: true, dataIndex: 'raws' , summaryType: 'sum' },
{header: 'Uniques', width: 280, sortable: true, dataIndex: 'uniques' , summaryType: 'sum' },
{header: 'Sent Emails', width: 440, sortable: true, dataIndex: 'sent_emails' , summaryType: 'sum' },
{header: 'Signups', width: 280, sortable: true, dataIndex: 'signups' , summaryType: 'sum' },
{header: 'Signup Amount', width: 520, sortable: true, dataIndex: 'signup_amount' , renderer: Ext.util.Format.usMoney },
{header: 'Sales', width: 200, sortable: true, dataIndex: 'sales' , summaryType: 'sum' },
{header: 'Sales Amount', width: 480, sortable: true, dataIndex: 'sales_amount' , summaryType: 'sum' , renderer: Ext.util.Format.usMoney },
{header: 'Funds Raised', width: 480, sortable: true, dataIndex: 'funds_raised' , summaryType: 'sum' , renderer: Ext.util.Format.usMoney },
{header: 'Chargebacks', width: 440, sortable: true, dataIndex: 'chargebacks' , summaryType: 'sum' },
{header: 'Chargeback Amount', width: 680, sortable: true, dataIndex: 'chargeback_amount' , summaryType: 'sum' , renderer: Ext.util.Format.usMoney },
{header: 'Refunds', width: 280, sortable: true, dataIndex: 'refunds' , summaryType: 'sum' },
{header: 'Refund Amount', width: 520, sortable: true, dataIndex: 'refund_amount' , summaryType: 'sum' , renderer: Ext.util.Format.usMoney },
{header: 'Returns', width: 280, sortable: true, dataIndex: 'returns' , summaryType: 'sum' },
{header: 'Return Amount', width: 520, sortable: true, dataIndex: 'return_amount' , summaryType: 'sum' , renderer: Ext.util.Format.usMoney }
],

view: new Ext.grid.GroupingView({
forceFit: true,
showGroupName: false,
enableNoGroups: false,
enableGroupingMenu: false,
hideGroupedColumn: true
}),

plugins: summary,

tbar : [{
text: 'Toggle',
tooltip: 'Toggle the visibility of summary row',
handler: function(){summary.toggleSummaries();}
}],

frame: true,
width: 5720,
height: 450,
clicksToEdit: 1,
collapsible: true,
animCollapse: false,
trackMouseOver: false,
//enableColumnMove: false,
title: 'Sponsored Projects',
iconCls: 'icon-grid',
renderTo: 'information'
});

});

// set up namespace for application
Ext.ns('app.grid');
// store dummy data in the app namespace
app.grid.dummyData = [
{day_time :'2009-08-26 01:00:00',raws :'1',uniques :'1',sent_emails :'0',opened_emails :'0',signups :'0',signup_amount :'0',sales :'0',sales_amount :'0',funds_raised :'0',chargebacks :'0',chargeback_amount :'0',refunds :'0',refund_amount :'0',returns :'0',return_amount :'0',project :'Overview Stats',task_id :'1'},
{day_time :'2009-08-26 03:00:00',raws :'1',uniques :'1',sent_emails :'0',opened_emails :'0',signups :'0',signup_amount :'0',sales :'0',sales_amount :'0',funds_raised :'0',chargebacks :'0',chargeback_amount :'0',refunds :'0',refund_amount :'0',returns :'0',return_amount :'0',project :'Overview Stats',task_id :'2'}
];

jarlau
27 Aug 2009, 12:55 AM
because of missing dataIndex 'project' in columns, the store's groupField is 'project' but no such column will cause error.