Search code examples
extjs4

ExtJS 4 GroupingSummary How To Deactivate Expand on Summary Row Click


I have an ExtJS 4 grid with GroupingSummary Feature. ExtJs Default is grid is expanded when user clicks on any cell in grouping row. I want to disable this feature, no expansion should take place except when user clicks on designated 'expand' icon. How do I accomplish this? There is the 'groupclick' event, is there a way to override its default behaviour and do nothing / remove it? Thanks in advance


Solution

  • The method for it appears to be inherited from Grouping rather than GroupingSummary, so I suspect you need to override this method to prevent the current behaviour:

        onGroupClick: function(view, group, idx, foo, e) {
        var me = this,
            toggleCls = me.toggleCls,
            groupBd = Ext.fly(group.nextSibling, '_grouping');
    
        if (groupBd.hasCls(me.collapsedCls)) {
            me.expand(groupBd);
        } else {
            me.collapse(groupBd);
        }
    

    So you will need another file with something similar to the following:

    Ext.require('Ext.grid.Grouping');
    Ext.define('your.class.here', {
    override: 'Ext.grid.Grouping',
    
      onGroupClick: function() {
         //do nothing
      });
    )};
    

    Then you should be able to write a function that mimicks it was doing on groupclick, but instead on your icon click. Hope that helps.