PDA

View Full Version : Adding data to a GroupingView



jaredhocutt
24 Feb 2011, 9:57 AM
I'm having a bit of trouble with adding data to a GroupingView and getting it to group correctly. On page load, I pass the initial data using a JsonReader that contains a entry with blank data and the group name, such that basically each possible group shows up with a single empty row under it. Then I have the groupclick event perform an ajax call to get the actual data for that group and add it to the store. However, when I do this, it creates a new group (with the same name as a group already showing) and then adds the data to it. I want the data to show under the existing group.

Here is the code that I have doing this:



var store = new Ext.data.GroupingStore({
reader: new Ext.data.JsonReader({
root: 'counters',
fields: [
'definition',
'counter',
'col1',
'col2'
]
}),
proxy: new Ext.data.ScriptTagProxy({
url: 'http://example.com/json_data_with_groups_only.php'
}),
sortInfo: {
field: 'counter',
direction: 'asc'
},
groupField: 'definition',
autoDestroy: true
});

var columns = new Ext.grid.ColumnModel({
columns: [{
header: 'Definition',
dataIndex: 'definition'
}, {
header: 'Counter',
dataIndex: 'counter'
}, {
header: 'Column 1',
dataIndex: 'col1'
}, {
header: 'Column 2',
dataIndex: 'col2'
}],
defaults: {
sortable: true
}
});

var view = new Ext.grid.GroupingView({
forceFit: true,
hideGroupedColumn: true,
showGroupName: false,
startCollapsed: true,
groupTextTpl: '{text}'
});

var grid = new Ext.grid.GridPanel({
title: 'Stat Counter Manager',
store: store,
colModel: columns,
view: view,
width: 'fill',
autoHeight: true,
renderTo: 'stat_counters_grid'
});

grid.on('groupclick', function(grid, field, value, e) {
Ext.Ajax.request({
url: 'http://example.com/json_data_of_definition?counter_definition=' + value,
success: function(response) {
store.add(Ext.decode(response.responseText));
}
});
});

store.load();

Trip
15 Jun 2011, 7:00 AM
jaredhocutt,

I had a similar problem in my own project. I ended up using the sort function associated with the store.

In this case after you do:


store.add(Ext.decode(response.responseText));

do something like:



store.sort([{
field: 'definition',
direction: 'ASC'
}],'ASC');


you can also add additional sorting routines by adding them to the config:




store.sort([{
field: 'definition',
direction: 'ASC'
},{
field: 'counter',
direction: 'ASC'
}],'ASC');

Cheers

johnsonkid
7 Jul 2011, 12:20 AM
THANK YOU
i think i should thank you very much for you can waste lot of time to write this post .....
thank you again for your sharing..



Diablo 3 Gold (http://www.clearancesaleuk.com/the-perfect-coach-outlet)