Results 1 to 10 of 10

Thread: {renderedGroupValue} in groupHeaderTpl not working

    Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-8172 in 5.1.1.451.
  1. #1
    Sencha Premium Member
    Join Date
    Jan 2010
    Location
    Vancouver, Canada
    Posts
    262

    Default {renderedGroupValue} in groupHeaderTpl not working

    Ext version tested:

    • Ext 4.2 Beta


    Browser versions tested against:

    • Chrome 23.0.1271.97 m

    Description:

    According to the documentation, http://docs.sencha.com/ext-js/4-1/#!...ature.Grouping, {renderedGroupValue} is:

    The rendered value of the groupField for the group header being rendered, as produced by the column renderer.
    and {name} is:

    An alias for renderedGroupValue
    {renderedGroupValue} doesn't work, while {name} works.

    Please note that I like much better using the {renderedGroupValue} variable since it conveys clearly the meaning of the variable. {name} is confusing. If you look at the groupgrid.js sample 'name' is the dataIndex (or name) of the column that contains the restaurant names.

    Steps to reproduce the problem:


    The result that was expected:

    • The group header to contain the cuisine value after the word 'Cuisine:' .


    The result that occurs instead:

    • The cuisine is value is not displayed

    Test Case:

    Don't have one. I will leave up to you to create one.

    Operating System:

    • Windows 7 64 bit

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,451

    Default

    Thanks for the report.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Fullstack Engineer
    ________________
    Modus Create is based on the model of an open source team. We’re a remote, global team of experts in our field. To find out more about the work we do, head over to our website.

    Check out my GitHub:
    https://github.com/mitchellsimoens

  3. #3
    fabio.policeno's Avatar
    Join Date
    Sep 2010
    Location
    Curitiba - Brazil
    Posts
    366

    Default Possible fix

    Code:
    Ext.define('Overrides.grid.feature.Grouping', {	override: 'Ext.grid.feature.Grouping',
        
        setupRowData: function(record, idx, rowValues) {
            var me = this,
                data = me.refreshData,
                groupInfo = me.groupInfo,
                header = data.header,
                groupField = data.groupField,
                store = me.view.dataSource,
                grouper, groupName, prev, next,
                column = me.dataSource.grid.down('gridcolumn[dataIndex=' + groupField + ']'); //override
    
    
            rowValues.isCollapsedGroup = false;
            rowValues.summaryRecord = null;
    
    
            if (data.doGrouping) {
                grouper = me.view.store.groupers.first();
                groupName = grouper.getGroupString(record);
    
    
                // See if the current record is the last in the group
                rowValues.isFirstRow = idx === 0;
                if (!rowValues.isFirstRow) {
                    prev = store.getAt(idx - 1);
                    // If the previous row is of a different group, then we're at the first for a new group
                    if (prev) {
                        // Must use Model's comparison because Date objects are never equal
                        rowValues.isFirstRow = !prev.isEqual(grouper.getGroupString(prev), groupName);
                    }
                }
    
    
                // See if the current record is the last in the group
                rowValues.isLastRow = idx == store.getTotalCount() - 1;
                if (!rowValues.isLastRow) {
                    next = store.getAt(idx + 1);
                    if (next) {
                        // Must use Model's comparison because Date objects are never equal
                        rowValues.isLastRow = !next.isEqual(grouper.getGroupString(next), groupName);
                    }
                }
    
    
                if (rowValues.isFirstRow) {
                    groupInfo.groupField = groupField;
                    groupInfo.name = groupName;
                    groupInfo.groupValue = record.get(groupField);
                    groupInfo.columnName = header ? header.text : groupField;
                    groupInfo.renderedGroupValue = column && column.renderer ? column.renderer(groupName, null, record) : groupName; //override
    
    
                    rowValues.collapsibleCls = me.collapsible ? me.collapsibleCls : me.hdNotCollapsibleCls;
                    rowValues.groupId = me.createGroupId(groupName);
    
    
                    if (!me.isExpanded(groupName)) {
                        rowValues.itemClasses.push(me.hdCollapsedCls);
                        rowValues.isCollapsedGroup = true;
                    }
    
    
                    // We only get passed a GroupStore if the store is not buffered
                    if (store.buffered) {
                        groupInfo.rows = groupInfo.children = [];
                    } else {
                        groupInfo.rows = groupInfo.children = me.getRecordGroup(record).children;
                    }
                    rowValues.groupInfo = groupInfo;
                }
    
    
                if (rowValues.isLastRow) {
                    // Add the group's summary record to the last record in the group
                    if (me.showSummaryRow) {
                        rowValues.summaryRecord = data.summaryData[groupName];
                    }
                }
            }
        }
    });

  4. #4
    Ext JS Premium Member
    Join Date
    Jun 2011
    Location
    St. Louis
    Posts
    225

    Default

    Looks like this bug is still in 4.2.1GA. Please fix the bugs.

    The same bug was in 4.0.x and fixed in 4.1.1A.

  5. #5
    Ext JS Premium Member anselmtmcclain's Avatar
    Join Date
    Mar 2008
    Location
    Northern California
    Posts
    115

    Default

    Still seeing this bug in ExtJS5 - should it be re-filed in the 5.x bugs forum, or is this open ticket mean that it's still being worked on generally?

  6. #6
    Sencha Premium Member poloyc's Avatar
    Join Date
    Jul 2010
    Location
    Torreon
    Posts
    8

    Default

    Same problem here! Neither name or renderedGroupValue not working! I get the value before render.

  7. #7
    Sencha User makana's Avatar
    Join Date
    Apr 2008
    Location
    Dresden, Germany
    Posts
    527

    Default

    I also wondered about what happened to the grouping feature since Ext 4.

    That's the fix I used so long:
    Code:
    /**
     * @class Ext.override.grid.feature.Grouping
     * @override Ext.grid.feature.Grouping
     * Grouping bug fixes.
     * @date 2013-04-24
     */
    Ext.define('Ext.override.grid.feature.Grouping', {
    	override: 'Ext.grid.feature.Grouping',
    
    	/**
    	 * @inheritdoc
    	 */
    	setupRowData: function(record, idx)
    	{
    		var me = this,
    			data = me.refreshData,
    			groupInfo = me.groupInfo,
    			header = data.header,
    			view = me.view,
    			store = view.dataSource;
    		me.callParent(arguments);
    
    		groupInfo.name = groupInfo.renderedGroupValue = groupInfo.groupValue;
    		if (header && header.renderer && header.renderer.call)
    			groupInfo.name = groupInfo.renderedGroupValue = header.renderer.call(
    				header.scope || view.ownerCt,
    				groupInfo.groupValue,
    				{}, // unused
    				record,
    				idx,
    				header.getOwnerHeaderCt().getHeaderIndex(header),
    				store,
    				view);
    	}
    });
    Programming today is a race between software engineers striving to build bigger and better ?diot-proof programs, and the universe striving to produce bigger and better idiots. So far, the universe is winning. (Rick Cook)

    Enhanced ExtJS adapter for Adobe AIR

  8. #8
    Sencha Premium Member
    Join Date
    Sep 2014
    Location
    Graz
    Posts
    21

    Default

    here is the working fix for ExtJS 5.1.0

    Code:
    Ext.define('Overrides.grid.feature.Grouping', {    override: 'Ext.grid.feature.Grouping',    
        setupRowData: function(record, idx, rowValues) {
            var me = this,
                recordIndex = rowValues.recordIndex,
                data = me.refreshData,
                groupInfo = me.groupInfo,
                header = data.header,
                groupField = data.groupField,
                store = me.view.getStore(),
                dataSource = me.view.dataSource,
                grouper, groupName, prev, next, items,
                column = me.dataSource.groupingFeature.grid.getColumnById(groupField); //override
                
    
    
            rowValues.isCollapsedGroup = false;
            rowValues.summaryRecord = rowValues.groupHeaderCls = null;
    
    
            if (data.doGrouping) {
                grouper = store.getGrouper();
    
    
                // This is a placeholder record which represents a whole collapsed group
                // It is a special case.
                if (record.isCollapsedPlaceholder) {
                    groupName = record.group.getGroupKey();
                    items = record.group.items;
    
    
                    rowValues.isFirstRow = rowValues.isLastRow = true;
                    rowValues.groupHeaderCls = me.hdCollapsedCls;
                    rowValues.isCollapsedGroup = rowValues.needsWrap = true;
                    rowValues.groupName = groupName;
                    rowValues.groupInfo = groupInfo;
                    groupInfo.groupField = groupField;
                    groupInfo.name = groupName;
                    groupInfo.groupValue = items[0].get(groupField);
                    groupInfo.columnName = header ? header.text : groupField;
                    rowValues.collapsibleCls = me.collapsible ? me.collapsibleCls : me.hdNotCollapsibleCls;
                    groupInfo.rows = groupInfo.children = items;
                    if (me.showSummaryRow) {
                        rowValues.summaryRecord = data.summaryData[groupName];
                    }
                    return;
                }
    
    
                groupName = grouper.getGroupString(record);
    
    
                // If caused by an update event on the first or last records of a group fired by a GroupStore, the record's group will be attached.
                if (record.group) {
                    items = record.group.items;
                    rowValues.isFirstRow = record === items[0];
                    rowValues.isLastRow  = record === items[items.length - 1];
                }
    
    
                else {
                    // See if the current record is the last in the group
                    rowValues.isFirstRow = recordIndex === 0;
                    if (!rowValues.isFirstRow) {
                        prev = store.getAt(recordIndex - 1);
                        // If the previous row is of a different group, then we're at the first for a new group
                        if (prev) {
                            // Must use Model's comparison because Date objects are never equal
                            rowValues.isFirstRow = !prev.isEqual(grouper.getGroupString(prev), groupName);
                        }
                    }
    
    
                    // See if the current record is the last in the group
                    rowValues.isLastRow = recordIndex == (store.isBufferedStore ? store.getTotalCount() : store.getCount()) - 1;
                    if (!rowValues.isLastRow) {
                        next = store.getAt(recordIndex + 1);
                        if (next) {
                            // Must use Model's comparison because Date objects are never equal
                            rowValues.isLastRow = !next.isEqual(grouper.getGroupString(next), groupName);
                        }
                    }
                }
    
    
                if (rowValues.isFirstRow) {
                    groupInfo.groupField = groupField;
                    groupInfo.name = groupName;
                    groupInfo.groupValue = record.get(groupField);
                    groupInfo.columnName = header ? header.text : groupField;
                    groupInfo.renderedGroupValue = column && column.renderer ? column.renderer(groupName, null, record) : groupName; //override
                    rowValues.collapsibleCls = me.collapsible ? me.collapsibleCls : me.hdNotCollapsibleCls;
                    rowValues.groupName = groupName;
    
    
                    if (!me.isExpanded(groupName)) {
                        rowValues.itemClasses.push(me.hdCollapsedCls);
                        rowValues.isCollapsedGroup = true;
                    }
    
    
                    // We only get passed a GroupStore if the store is not buffered
                    if (dataSource.isBufferedStore) {
                        groupInfo.rows = groupInfo.children = [];
                    } else {
                        groupInfo.rows = groupInfo.children = me.getRecordGroup(record).items;
                    }
                    rowValues.groupInfo = groupInfo;
                }
    
    
                if (rowValues.isLastRow) {
                    // Add the group's summary record to the last record in the group
                    if (me.showSummaryRow) {
                        rowValues.summaryRecord = data.summaryData[groupName];
                        rowValues.itemClasses.push(Ext.baseCSSPrefix + 'grid-group-last');
                    }
                }
                rowValues.needsWrap = (rowValues.isFirstRow || rowValues.summaryRecord);
            }
        },
    });

  9. #9
    Sencha Premium Member
    Join Date
    Mar 2010
    Posts
    150

    Default

    Hey.. do you have another override for 'grid.getColumnById()' as I dont seem to find this in the library ?Thanks

  10. #10
    Sencha Premium Member
    Join Date
    Sep 2014
    Location
    Graz
    Posts
    21

    Default

    Yes, our framework modification has that method (extending Ext.grid.panel), i thought it's part of Ext itself.

    the method is this:

    Code:
    getColumnById: function(dataIndex){	return Ext.Array.findBy(this.columns, function(col) { return col.dataIndex == dataIndex; });
    }

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •