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