Ext GroupingView is not working simply listing the rows without grouping

I am trying to use Ext GroupingView but its simply listing the rows without grouping my code for GroupingStore:

 //......................................................//
_store = new Ext.data.GroupingStore({
    autoDestroy: true,
    proxy: new Ext.data.MemoryProxy({ items: [] }),
    remoteSort: true,
    groupOnSort: true,
      sortInfo: {
      field: 'xxxExamProfg',
      direction: "ASC"
  },
  groupField: 'xxxExamProfg',            
    reader: new yyy.xxxExamDetJsonReader()
});

_gridPanel = new yyy.xxxExamDetGridPanel(Ext.copyTo({
    id: _this.id + '-gridPaneld',
    store: _store,
}, _this.initialConfig, []));

Ext.apply(_this, {
    onRender: function(ct, position) {
        yyy.xxxExamDetListField.superclass.onRender.call(_this, ct, position);
        _this.wrap = _this.el.wrap({ cls: 'x-form-field-wrap' });
        _this.resizeEl = _this.positionEl = _this.wrap;
        _gridPanel.render(_this.wrap);
    },
    //......................................................//
    setValue: function(v) {
        _gridPanel.getStore().proxy.data.items = v;
        _gridPanel.getStore().load();
        return yyy.xxxExam开发者_如何转开发DetListField.superclass.setValue.apply(_this, arguments);
    },
    getValue: function() {
        return _gridPanel.getStore().proxy.data.items;
    }
});

and my code for gridpanel:

yyy.xxxExamDetGridPanel = Ext.extend(Ext.grid.GridPanel, {
    border: false,
    initComponent: function() {
        this.colModel = new Ext.grid.ColumnModel({
        defaults: { width: 100, sortable: true },
        view: new Ext.grid.GroupingView({
            forceFit: true,
            // custom grouping text template to display the number of items per group
            groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
        }),
            columns: [
                { dataIndex: 'Fservice', header: 'Exam Code', xtype: 'gridcolumn' },
                { dataIndex: 'xxxExamProfgdescr', header: 'xxxExamProfgdescr', xtype: 'gridcolumn' },
                { dataIndex: 'xxxExamProfg', header: 'xxxExamProfg', xtype: 'gridcolumn' },
                { dataIndex: 'Fedate', header: 'Date', xtype: 'datecolumn', format: 'd/m/Y' }
            ]
        });
        yyy.xxxGridPanel.superclass.initComponent.apply(this, arguments);
    } //initComponent
});

Ext.reg('yyy.xxxExamDetGridPanel', yyy.xxxDetGridPanel);

I am trying to figure out why listing only the rows without to group them or any way to debug it ?

You have placed your GroupingView inside ColumnModel. Instead you should assign it to this.view like you assign ColumnModel to this.colModel.

This is a good example of why indentation matters - your mistake would have been immediately clear to anyone a bit experienced.