PDA

View Full Version : [Emergency] How to group gridpanel! Help me!



chanphat01001
18 Nov 2010, 11:01 PM
I review a sample about grouping of gridpanel

http://www.java2s.com/Code/JavaScript/Ext-JS/GroupingGridPanel.htm

But it's not I need.

I need a combobox, with items are name of columns, and when user click on item of combobox, my girdpanel will auto group data in the column which is chosen in combobox. You can review function with below image:
23418

It my code:

//create groupingStore
var store = new Ext.data.GroupingStore({
url: 'http://localhost:8080/OxygenComponent/data/grid_data.json',
idProperty: 'id',
reader: new Ext.data.JsonReader({
root: 'items',
fields: ['id', 'code', 'name', 'accessed', 'modified', 'action_report', 'my_formula']
})
});

//processing for event select item in combobox to group data in grid panel
//but notthing happen! ...
function groupData() {
store.groupField = this.getValue();
store.load();
}

var comboBox = new Ext.form.ComboBox({
id: 'combobox',
triggerAction: 'all',
mode: 'local',
width: 110,
value: 'None',

store: new Ext.data.ArrayStore({
id: 0,
fields: ['myId', 'displayText'],
data: [['none', 'None'], ['code', 'Code'], ['name', 'Name'], ['accessed', 'Accessed'], ['modified', 'Modified'], ['action_report', 'Action Report']]
}),
valueField: 'myId',
displayField: 'displayText',

listeners: {
select: groupData
}
});

//create gridpanel
grid = new Ext.grid.GridPanel({
title: '',
store: store,
sm:checkboxSel,

columns: [
checkboxSel,
{header: 'Code', width: 100, dataIndex: 'code', sortable: true},
{header: 'Name', width: 100, dataIndex: 'name', sortable: true},
{header: 'Accessed', width: 100, dataIndex: 'accessed', sortable: true},
{header: 'Modified', width: 100, dataIndex: 'modified', sortable: true},
{header: 'Action Report', width: 200, dataIndex: 'action_report', sortable: true}
],

width: 626,
height: 250,
loadMask: true
});


Please help me to find solution or fix the problem