3 * Copyright(c) 2006-2010 Sencha Inc.
5 * http://www.sencha.com/license
7 Ext.onReady(function(){
13 var reader = new Ext.data.JsonReader({
16 {name: 'projectId', type: 'int'},
17 {name: 'project', type: 'string'},
18 {name: 'taskId', type: 'int'},
19 {name: 'description', type: 'string'},
20 {name: 'estimate', type: 'float'},
21 {name: 'rate', type: 'float'},
22 {name: 'cost', type: 'float'},
23 {name: 'due', type: 'date', dateFormat:'m/d/Y'}
25 // additional configuration for remote
31 // define a custom summary function
32 Ext.ux.grid.GroupSummary.Calculations['totalCost'] = function(v, record, field){
33 return v + (record.data.estimate * record.data.rate);
36 // utilize custom extension for Hybrid Summary
37 var summary = new Ext.ux.grid.HybridSummary();
39 var grid = new xg.EditorGridPanel({
40 ds: new Ext.data.GroupingStore({
43 proxy : new Ext.data.HttpProxy({
44 url: 'totals-hybrid.json',
47 sortInfo: {field: 'due', direction: 'ASC'},
57 dataIndex: 'description',
60 summaryRenderer: function(v, params, data){
61 return ((v === 0 || v > 1) ? '(' + v +' Tasks)' : '(1 Task)');
63 editor: new Ext.form.TextField({
77 renderer: Ext.util.Format.dateRenderer('m/d/Y'),
78 editor: new Ext.form.DateField({
85 dataIndex: 'estimate',
87 renderer : function(v){
90 editor: new Ext.form.NumberField({
93 style: 'text-align:left'
99 renderer: Ext.util.Format.usMoney,
101 summaryType:'average',
102 editor: new Ext.form.NumberField({
104 allowNegative: false,
105 style: 'text-align:left'
113 renderer: function(v, params, record){
114 return Ext.util.Format.usMoney(record.data.estimate * record.data.rate);
117 summaryType: 'totalCost',
118 summaryRenderer: Ext.util.Format.usMoney
122 view: new Ext.grid.GroupingView({
124 showGroupName: false,
125 enableNoGroups:false,
126 enableGroupingMenu:false,
127 hideGroupedColumn: true
134 tooltip: 'Toggle the visibility of summary row',
135 handler: function(){summary.toggleSummaries();}
144 trackMouseOver: false,
145 //enableColumnMove: false,
146 title: 'Sponsored Projects',
147 iconCls: 'icon-grid',
148 renderTo: document.body
151 grid.on('afteredit', function(){
152 var groupValue = 'Ext Forms: Field Anchoring';
153 summary.showSummaryMsg(groupValue, 'Updating Summary...');
154 setTimeout(function(){ // simulate server call
155 // HybridSummary class implements updateSummaryData
156 summary.updateSummaryData(groupValue,
157 // create data object based on configured dataIndex
158 {description: 22, estimate: 888, rate: 888, due: new Date(), cost: 8});
162 // load the remote data