PDA

View Full Version : How to update Grid Summary after updating column values



olakara
17 Jan 2012, 11:39 AM
Hi all,

I have a grid with summary feature and rowediting plugin enabled. Here is what my grid looks like:
30781

When the grid is rendered, the summary column display its values correctly. But my users will make use of the row editing feature to edit values like qty or price. I modify the total value through edit event:


'edit' : function(editor, e) {
console.log('Recalculate the data');
var rec = e.record;
rec.set('total',rec.get('price') * rec.get('qty'));
rec.commit();
}

But there is no change in Summary Row of the grid. How do I update the summary row when the values change? I just can figure out how to update it.. or did I miss something simple?!

Thanks in advance,

mitchellsimoens
17 Jan 2012, 12:52 PM
Just tested in 4.1.0 beta 1 and it is working.

olakara
17 Jan 2012, 11:55 PM
@mitchellsimoens Thanks for your reply. But I am running it on 4.1 beta and not able to see any update on summary row happening!

Here is my View & Controller:

View:


features: [{
ftype: 'summary'
}],
plugins: [
Ext.create('Ext.grid.plugin.RowEditing', {
clicksToEdit: 1,
errorSummary: false
})
],
columns: [{
text: 'Type',
dataIndex: 'type',
renderer: function(value) {
// code..
},
editor: {
xtype: 'combobox',
store: 'PTypeStore',
queryMode: 'local',
displayField: 'type',
valueField: 'value'
}
},{
text: 'Description',
dataIndex: 'description',
flex: 2,
editor: {
xtype: 'triggerfield',
onTriggerClick: function() {
// code..
}
}
},{
text: 'Qty',
dataIndex: 'qty',
editor: 'numberfield'
},{
text: 'Price',
dataIndex: 'price',
editor: 'numberfield',
summaryType: 'count',
summaryRenderer: function(value, summaryData, dataIndex) {
return "Total";
}
},{
text: 'Sub Total',
dataIndex: 'total',
summaryType: 'sum',
editor: 'numberfield'
}]


And controller:


init: function() {
console.log('init method for Invoice controller');
this.control({
'invlist' : {
'edit' : function(editor, e) {
console.log('Recalculate the data...');
var rec = e.record;
var newTotal = rec.get('price') * rec.get('qty');
rec.set('total',newTotal);
var rec = e.record;
rec.commit();
},
'canceledit' : function(editor, e) {
console.log('Canceled the edit');
console.log(e);
}
},
'invlist button[action="addentry"]' : {
'click': function(but,e) {
panel = but.up('invlist');
plugin = panel.getPlugin();
plugin.cancelEdit();

var r = Ext.create('Exp.model.OrderItem', {
type: 0,
description: '',
qty: 0,
price: 0,
total: 0
});

store = panel.getStore();
store.insert(store.count(), r);
plugin.startEdit(store.count()-1, 0);
}
},
'invlist button[action=removeentry]' : {
'click': function(but,e) {
panel = but.up('invlist');
// remove the entry
}
}
});
}


Am I missing some configuration?

mitchellsimoens
18 Jan 2012, 4:16 AM
I took the grouping summary example that comes with the download, changed it to regular summary feature and changed it from CellEditing to RowEditing and it worked.

olakara
18 Jan 2012, 4:29 AM
Thanks for the info! I will play with the example and see if I can get it to work :)

smokeman
8 May 2012, 2:00 PM
any way to call a refresh on the summary?

smokeman
9 May 2012, 8:13 AM
I found an interesting tidbit on further investigation.
I took out my rowsummary feature, and tried to substitute it with a dataview, and a rendering template.
I made my template call an each function on the records in the store, and update a total value.
it was working the same way as the summary feature plugin...my total was only updating after adding another record, not after my roweditor did an update.

I added a listener to the store, using datachange:
and what I found, was that the store only triggered a datachange after doing a store.insert(index,model), and not after my roweditor update function triggers a rec.commit();

rec.commit(); should trigger a store datachange, shouldn't it?
looks like a bug to me.

smokeman
9 May 2012, 11:08 AM
I figured out a workaround for my specific issue, not sure if it will help you too.
I noticed that by inserting another record, it triggers the totals to recalculate.

Another problem I was having, was in my code, I was adding a new record, before my previous roweditor rec.commit was taking place. I was able to move my new record insert to a listener on the store, for the update 'commit' operation.

I still think there is a bug here, but it may be on store events, and not necessarily the summary plugin, etc...

a summaryUpdate function would help.

banel
2 Aug 2012, 10:57 PM
To refresh summary after record.commit(), just call grid.getView().refresh() method

ftrevino
12 Feb 2013, 9:43 AM
try adding this to your controller:


'gridpanel':
{
edit: function(editor, e) {
e.grid.getView().refresh();
}
}


it worked for me.

mysticav
20 Aug 2013, 9:06 PM
view().refresh() does not work on 4.2.1.

Totals are not updated after you remove a row from grid.