Question

here is the example edited by crop grid:

1st i view like a normal grid like this image

http://imageshack.us/f/836/groupcontrollingb4.png/

then i create a check box name as “Cuisine:American” and check it to reload become image like this

http://imageshack.us/f/803/gridcontrollingafter.png/

the group data “Cuisine:American” can be group it and expand
then other data still remain the normal grid view

Does any one know a example or possibility for controlling the groupView like in the example i’ve shown ?

Hope u all can understand my question
thankz.

Answer 1

It’s harder than it should be, because ext is not calling Ext.util.Grouper.getGroupString method. I’ve managed to bypass this. Here is working sample: http://jsfiddle.net/bP7Y2/

I am basing on Grouped Grid Example from Ext JS site. I’ve created CuisineGrouper which is extending Ext.util.Grouper. There are 2 important methods: getGroupString which returns gruping string and sorterFn which sorts in that way that grupped elements are on the top. For example when there is grouping by ‘Cuisine:American’ getGroupString returns ‘American’ or ” depending on cuisine value.

Another important bit is overriden getGroupString method on Restaurants store, so now it calls Ext.util.Grouper.getGroupString.

Last thing I’ve modified is groupHeaderTpl of groupingFeature.

(Update) It’s possible to hide Others grouping header with some hacks. Example: http://jsfiddle.net/bP7Y2/1/