0

I am using ExtJs 4.1 grid and have added group feature. In the store I have specified the groupField and grouping feature is working fine. But when the grid renders, the group header is shown as Group: Group-Name". How Can I prevent 'Group' keyword from appearing in the group header (which is highlighted on below image).

enter image description here

Ext.require(['Ext.data.*', 'Ext.grid.*']);
Ext.onReady(function() {
   Ext.regModel('Teams', {
       fields: ['name', 'sport']
   });

   var teamStore = new Ext.data.Store({
       model: 'Teams',
       sorters: ['sport','name'],
       groupField: 'sport',
       data: [
           { name: 'Aaron', sport: 'Table Tennis' },
           { name: 'Aaron', sport: 'Football' },
           { name: 'Abe', sport: 'Basketball' },
           { name: 'Tommy', sport: 'Football' },
           { name: 'Tommy', sport: 'Basketball' },
           { name: 'Jamie', sport: 'Table Tennis' },
           { name: 'Brian', sport: 'Basketball' },
           { name: 'Brian', sport: 'Table Tennis' }
       ]
   });

   var grid = new Ext.grid.GridPanel({
       renderTo: Ext.getBody(),
       store: teamStore,
       width: 400,
       height: 300,
       title: 'Sports Teams',
       features: [{
           ftype: 'grouping'
       }],
       headers: [{
           text: 'Name',
           flex: 1,
           dataIndex: 'name'
       },{
           text: 'Sport',
           dataIndex: 'sport'
       }]
   });
});
SharpCoder
  • 18,279
  • 43
  • 153
  • 249

1 Answers1

-1
features: [{
        ftype: 'grouping',
        groupHeaderTpl: '{name}'
    }]
Nikos Hidalgo
  • 3,666
  • 9
  • 25
  • 39
Mainak Bhattacharyya
  • 1