/*!
- * Ext JS Library 3.0.3
- * Copyright(c) 2006-2009 Ext JS, LLC
+ * Ext JS Library 3.2.0
+ * Copyright(c) 2006-2010 Ext JS, Inc.
* licensing@extjs.com
* http://www.extjs.com/license
*/
-Ext.onReady(function(){\r
-\r
- Ext.QuickTips.init();\r
-\r
- var xg = Ext.grid;\r
-\r
- var reader = new Ext.data.JsonReader({\r
- idProperty:'taskId',\r
- fields: [\r
- {name: 'projectId', type: 'int'},\r
- {name: 'project', type: 'string'},\r
- {name: 'taskId', type: 'int'},\r
- {name: 'description', type: 'string'},\r
- {name: 'estimate', type: 'float'},\r
- {name: 'rate', type: 'float'},\r
- {name: 'cost', type: 'float'},\r
- {name: 'due', type: 'date', dateFormat:'m/d/Y'}\r
- ],\r
- // additional configuration for remote\r
- root:'data',\r
- remoteGroup:true,\r
- remoteSort: true\r
- });\r
-\r
- // define a custom summary function\r
- Ext.ux.grid.GroupSummary.Calculations['totalCost'] = function(v, record, field){\r
- return v + (record.data.estimate * record.data.rate);\r
- };\r
-\r
- // utilize custom extension for Hybrid Summary\r
- var summary = new Ext.ux.grid.HybridSummary();\r
-\r
- var grid = new xg.EditorGridPanel({\r
- ds: new Ext.data.GroupingStore({\r
- reader: reader,\r
- // use remote data\r
- proxy : new Ext.data.HttpProxy({\r
- url: 'totals-hybrid.json',\r
- method: 'GET'\r
- }),\r
- sortInfo: {field: 'due', direction: 'ASC'},\r
- groupField: 'project'\r
- }),\r
-\r
- columns: [\r
- {\r
- id: 'description',\r
- header: 'Task',\r
- width: 80,\r
- sortable: true,\r
- dataIndex: 'description',\r
- summaryType: 'count',\r
- hideable: false,\r
- summaryRenderer: function(v, params, data){\r
- return ((v === 0 || v > 1) ? '(' + v +' Tasks)' : '(1 Task)');\r
- },\r
- editor: new Ext.form.TextField({\r
- allowBlank: false\r
- })\r
- },{\r
- header: 'Project',\r
- width: 20,\r
- sortable: true,\r
- dataIndex: 'project'\r
- },{\r
- header: 'Due Date',\r
- width: 25,\r
- sortable: true,\r
- dataIndex: 'due',\r
- summaryType:'max',\r
- renderer: Ext.util.Format.dateRenderer('m/d/Y'),\r
- editor: new Ext.form.DateField({\r
- format: 'm/d/Y'\r
- })\r
- },{\r
- header: 'Estimate',\r
- width: 20,\r
- sortable: true,\r
- dataIndex: 'estimate',\r
- summaryType:'sum',\r
- renderer : function(v){\r
- return v +' hours';\r
- },\r
- editor: new Ext.form.NumberField({\r
- allowBlank: false,\r
- allowNegative: false,\r
- style: 'text-align:left'\r
- })\r
- },{\r
- header: 'Rate',\r
- width: 20,\r
- sortable: true,\r
- renderer: Ext.util.Format.usMoney,\r
- dataIndex: 'rate',\r
- summaryType:'average',\r
- editor: new Ext.form.NumberField({\r
- allowBlank: false,\r
- allowNegative: false,\r
- style: 'text-align:left'\r
- })\r
- },{\r
- id: 'cost',\r
- header: 'Cost',\r
- width: 20,\r
- sortable: false,\r
- groupable: false,\r
- renderer: function(v, params, record){\r
- return Ext.util.Format.usMoney(record.data.estimate * record.data.rate);\r
- },\r
- dataIndex: 'cost',\r
- summaryType: 'totalCost',\r
- summaryRenderer: Ext.util.Format.usMoney\r
- }\r
- ],\r
-\r
- view: new Ext.grid.GroupingView({\r
- forceFit:true,\r
- showGroupName: false,\r
- enableNoGroups:false,\r
- enableGroupingMenu:false,\r
- hideGroupedColumn: true\r
- }),\r
-\r
- plugins: summary,\r
-\r
- tbar : [{\r
- text: 'Toggle',\r
- tooltip: 'Toggle the visibility of summary row',\r
- handler: function(){summary.toggleSummaries();}\r
- }],\r
-\r
- frame: true,\r
- width: 800,\r
- height: 450,\r
- clicksToEdit: 1,\r
- collapsible: true,\r
- animCollapse: false,\r
- trackMouseOver: false,\r
- //enableColumnMove: false,\r
- title: 'Sponsored Projects',\r
- iconCls: 'icon-grid',\r
- renderTo: document.body\r
- });\r
-\r
- grid.on('afteredit', function(){\r
- var groupValue = 'Ext Forms: Field Anchoring';\r
- summary.showSummaryMsg(groupValue, 'Updating Summary...');\r
- setTimeout(function(){ // simulate server call\r
- // HybridSummary class implements updateSummaryData\r
- summary.updateSummaryData(groupValue,\r
- // create data object based on configured dataIndex\r
- {description: 22, estimate: 888, rate: 888, due: new Date(), cost: 8});\r
- }, 2000);\r
- });\r
-\r
- // load the remote data\r
- grid.store.load();\r
-\r
-});\r
+Ext.onReady(function(){
+
+ Ext.QuickTips.init();
+
+ var xg = Ext.grid;
+
+ var reader = new Ext.data.JsonReader({
+ idProperty:'taskId',
+ fields: [
+ {name: 'projectId', type: 'int'},
+ {name: 'project', type: 'string'},
+ {name: 'taskId', type: 'int'},
+ {name: 'description', type: 'string'},
+ {name: 'estimate', type: 'float'},
+ {name: 'rate', type: 'float'},
+ {name: 'cost', type: 'float'},
+ {name: 'due', type: 'date', dateFormat:'m/d/Y'}
+ ],
+ // additional configuration for remote
+ root:'data',
+ remoteGroup:true,
+ remoteSort: true
+ });
+
+ // 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 Hybrid Summary
+ var summary = new Ext.ux.grid.HybridSummary();
+
+ var grid = new xg.EditorGridPanel({
+ ds: new Ext.data.GroupingStore({
+ reader: reader,
+ // use remote data
+ proxy : new Ext.data.HttpProxy({
+ url: 'totals-hybrid.json',
+ method: 'GET'
+ }),
+ sortInfo: {field: 'due', direction: 'ASC'},
+ groupField: 'project'
+ }),
+
+ columns: [
+ {
+ id: 'description',
+ header: 'Task',
+ width: 80,
+ sortable: true,
+ dataIndex: 'description',
+ summaryType: 'count',
+ hideable: false,
+ summaryRenderer: function(v, params, data){
+ return ((v === 0 || v > 1) ? '(' + v +' Tasks)' : '(1 Task)');
+ },
+ editor: new Ext.form.TextField({
+ allowBlank: false
+ })
+ },{
+ header: 'Project',
+ width: 20,
+ sortable: true,
+ dataIndex: 'project'
+ },{
+ header: 'Due Date',
+ width: 25,
+ sortable: true,
+ dataIndex: 'due',
+ summaryType:'max',
+ renderer: Ext.util.Format.dateRenderer('m/d/Y'),
+ editor: new Ext.form.DateField({
+ format: 'm/d/Y'
+ })
+ },{
+ header: 'Estimate',
+ width: 20,
+ sortable: true,
+ dataIndex: 'estimate',
+ summaryType:'sum',
+ renderer : function(v){
+ return v +' hours';
+ },
+ editor: new Ext.form.NumberField({
+ allowBlank: false,
+ allowNegative: false,
+ style: 'text-align:left'
+ })
+ },{
+ header: 'Rate',
+ width: 20,
+ sortable: true,
+ renderer: Ext.util.Format.usMoney,
+ dataIndex: 'rate',
+ summaryType:'average',
+ editor: new Ext.form.NumberField({
+ allowBlank: false,
+ allowNegative: false,
+ style: 'text-align:left'
+ })
+ },{
+ id: 'cost',
+ header: 'Cost',
+ width: 20,
+ sortable: false,
+ groupable: false,
+ renderer: function(v, params, record){
+ return Ext.util.Format.usMoney(record.data.estimate * record.data.rate);
+ },
+ dataIndex: 'cost',
+ summaryType: 'totalCost',
+ summaryRenderer: 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: 800,
+ height: 450,
+ clicksToEdit: 1,
+ collapsible: true,
+ animCollapse: false,
+ trackMouseOver: false,
+ //enableColumnMove: false,
+ title: 'Sponsored Projects',
+ iconCls: 'icon-grid',
+ renderTo: document.body
+ });
+
+ grid.on('afteredit', function(){
+ var groupValue = 'Ext Forms: Field Anchoring';
+ summary.showSummaryMsg(groupValue, 'Updating Summary...');
+ setTimeout(function(){ // simulate server call
+ // HybridSummary class implements updateSummaryData
+ summary.updateSummaryData(groupValue,
+ // create data object based on configured dataIndex
+ {description: 22, estimate: 888, rate: 888, due: new Date(), cost: 8});
+ }, 2000);
+ });
+
+ // load the remote data
+ grid.store.load();
+
+});