Sorting the Grouped data in GridPanel of EXTJS by group_sort_order

Question

How to sort the EXT JS Grid Panel grouped data by its sortOrder

{Grouped data}                {Sort Order}

Audi                            [3]
    col11 col22 xol33
    col21 col23 cole3
Benz                            [1]
    col23 col32 cos32
    col32 dos34 sdfd2
Citron                          [4]
    jkj23 dfd23 fds23
    jkjkk jjkkk jkkkk
Nissan                          [2]
    col23 col32 cos32
    col32 dos34 sdfd2

Fot the above data I want to by sort its sort order (as i got sort order for each group element in my groupdatastore) as below

 Benz                            [1]
    col23 col32 cos32
    col32 dos34 sdfd2
 Nissan                          [2]
    col23 col32 cos32
    col32 dos34 sdfd2
 Audi                            [3]
    col11 col22 xol33
    col21 col23 cole3
 Citron                          [4]
    jkj23 dfd23 fds23
    jkjkk jjkkk jkkkk

score 9 · Accepted Answer · edited Feb 13 '14 at 21:06

9

Try setting these on the store:

remoteGroup:true,
remoteSort: true

And in you sql or what you use to get data out sort by grouping field first.

gridDataStoreObj = new Ext.data.GroupingStore(
{
    remoteGroup:true,
    remoteSort: true,
    proxy: new Ext.data.HttpProxy({url: 'index.php' }),
    method:'POST',
    groupField:'brandName',
    ...     
    sortInfo:{field: 'id', direction: "ASC"},
});

On the server:

select * from table order by brandName, id

This should sort groups themselves.

edited Feb 13 '14 at 21:06

Matt

20,108
1
57
70

answered Apr 08 '11 at 15:03

Dasha Salo

5,159
5
26
28

1

This worked well, but even with only remoteGroup and not remoteSort as true any sorting of columns goes to the server to sort. – Dave Dec 18 '12 at 14:17

score 3 · Answer 2 · answered Dec 18 '12 at 12:35

3

For extjs 4 and for local sorting, instede of using: groupField: 'mygroupfield' on the store

use:groupers: [{ property: 'tasklist_id', sorterFn: function(o1, o2){} }]

answered Dec 18 '12 at 12:35

Ruslan Talpa

533
3
8

score 1 · Answer 3 · answered Dec 18 '12 at 14:21

1

In the store use the sort order column as your groupField.

In the grid:

features: [
  {
    ftype: 'grouping',
    groupHeaderTpl: [
      '{[values.rows[0].groupId]}'
    ]
  }
]

Where groupId is the 'id' of the column that you want to display

answered Dec 18 '12 at 14:21

Dave

321
5
7

score 0 · Answer 4 · answered Mar 31 '11 at 23:31

0

in GroupingStore set property:

sortInfo: {field: 'Sort_order', direction: 'ASC'},

http://dev.sencha.com/deploy/dev/docs/?class=Ext.grid.GroupingView

answered Mar 31 '11 at 23:31

bensiu

24,660
56
77
117

SortInfo will only sort the data within the group i.e in Nissan group row1 and row2 will be sorted by the condition of sortinfo but in my case as all the rows within the Nissan group has same sort_Order It will not have any effect.I want to sort the group itself (i.e. Benz, Nissan, Audim, Citron) not the data inside the group. – Jemin Apr 03 '11 at 18:34
2

@Jemsworld: were you able to find a solution to do it in ExtJS? I dont want to implement remote sorting on the backend. – Farish Nov 21 '12 at 09:06

Sorting the Grouped data in GridPanel of EXTJS by group_sort_order

4 Answers4

Linked