PDA

View Full Version : [CLOSED] Grid grouping feature breaks column sorting



zombeerose
27 Sep 2011, 1:17 PM
REQUIRED INFORMATION

Ext version tested:

Ext 4.0 rev 6
Browser versions tested against:

FF6 (firebug 1.8 installed)
DOCTYPE tested against:

Strict
Description:

When a grid uses the grouping feature, then column sorting does not work.
Steps to reproduce the problem:

Run the test code.
Click the Replies column header to change the sort order.
To confirm that the problem is related to grouping, comment out the 'groupField' config for the store.
FYI: the same problem exists for local sorting (remoteSort: false).
The result that was expected:

The selected column and direction should be submitted as params to the service.
The result that occurs instead:

The recordset does not change and the sort param that is submitted is always title ASC.
Test Case:


Ext.Loader.setConfig({enabled: true});


Ext.Loader.setPath('Ext.ux', '../ux/');
Ext.require([
'Ext.grid.*',
'Ext.data.*',
'Ext.util.*'
]);


Ext.onReady(function(){
Ext.define('ForumThread', {
extend: 'Ext.data.Model',
fields: [
'title', 'forumtitle', 'forumid', 'author',
{name: 'replycount', type: 'int'},
{name: 'lastpost', mapping: 'lastpost', type: 'date', dateFormat: 'timestamp'},
'lastposter', 'excerpt', 'threadid'
],
idProperty: 'threadid'
});


// create the Data Store
var store = Ext.create('Ext.data.Store', {
id: 'store',
pageSize: 200,
autoLoad: true,
model: 'ForumThread',
remoteSort: true,
proxy: {
type: 'jsonp',
url: 'http://www.sencha.com/forum/remote_topics/index.php',
extraParams: {
total: 50000
},
reader: {
root: 'topics',
totalProperty: 'totalCount'
},
simpleSortMode: true
},
sorters: [{
property: 'lastpost',
direction: 'DESC'
}]
,groupField: 'title' //comment out to enable sorting
});




var panel = Ext.create('Ext.grid.Panel',{
features: [{ ftype: 'grouping' }],
renderTo: Ext.getBody(),
width: 700,
height: 400,
title: 'ExtJS.com - Browse Forums',
store: store,
loadMask: true,
disableSelection: true,
viewConfig: {
trackOver: false
},
columns:[{
xtype: 'rownumberer',
width: 50,
sortable: false
},{
id: 'topic',
text: "Topic",
dataIndex: 'title',
flex: 1,
sortable: true
},{
text: "Replies",
dataIndex: 'replycount',
align: 'center',
width: 70,
sortable: true
},{
id: 'last',
text: "Last Post",
dataIndex: 'lastpost',
width: 130,
renderer: Ext.util.Format.dateRenderer('n/j/Y g:i A'),
sortable: false
}]
});
});




HELPFUL INFORMATION

Possible fix:

not provided
Additional CSS used:

only default ext-all.css
Operating System:

WinXP Pro

evant
27 Sep 2011, 9:43 PM
Can confirm with your sample, I can't confirm this with local sorting:



Ext.define('Thing', {
extend: 'Ext.data.Model',
fields: ['category', 'name']
})

Ext.onReady(function(){

var data = [],
i = 0;

for (; i < 10; ++i) {
data.push({
name: i,
category: 'cat' + (i % 3)
});
}

Ext.create('Ext.grid.Panel', {
renderTo: document.body,
width: 400,
height: 400,
features: [Ext.create('Ext.grid.feature.Grouping')],
store: {
model: 'Thing',
data: data,
groupField: 'category',
sorters: [{
property: 'name',
direction: 'DESC'
}]
},
columns: [{
dataIndex: 'name',
header: 'Name'
}]
});

});


As I change the sort it behaves as I would expect.

evant
27 Sep 2011, 9:49 PM
Looking further, I don't think the test case is really a good representation.

Since it's using simpleSortMode, it takes the topmost sort parameter to send to the server. In this case, grouping always takes priority, which is why it's the only param passed. I don't really see any other reasonable behaviour, grouping always needs to take precedence over a sort, so with simpleSortMode this makes sense.

Marking as closed.

zombeerose
29 Sep 2011, 12:10 PM
Thanks for looking into this.

Might I request that a debug message be logged to the console if a developer configures a proxy with simpleSortMode: true and is grouping on a column in order to avoid this confusion in the future? Or at least mention in the API?

Thanks again.