Results 1 to 2 of 2

Thread: RowNumberer and Grouping feature showing extra group column header

    Wait! Looks like we don't have enough information to add this to bug database. Please follow this template bug format.
  1. #1
    Sencha User
    Join Date
    Oct 2012
    Location
    Albuquerque, NM - USA
    Posts
    5
    Vote Rating
    0
      0  

    Default RowNumberer and Grouping feature showing extra group column header

    Ext JS version - 4.1.3

    When using a RowNumberer column in a Grid with Grouping feature, the group header is being shown twice. Once for the grouped data, as expected, but also over the rowNumberer column. In addition, the header over the rowNumberer column is using the same groupHeaderTpl as grouped data, effectively showing the group header twice in the same row.

    This appears to be a bug, or at least a feature to me. It does violate my principle of least surprise when using the rowNumberer with Grouping. Is this a bug?

    I would expect the normal group header to span the whole row, and the rowNumberer header to not be present in the group header. Or, at the very least, the rowNumberer group header to be blank and not duplicate the same groupHeaderTpl as the grouped data.

    If you need a code example, I can generate one. I can't share the actual code.

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    18,426
    Vote Rating
    858
      0  

    Default

    I can't reproduce this with 4.1.3 or 4.2.x beta. Please post a test case. Here's what I used:

    Code:
    Ext.require(['Ext.data.*', 'Ext.grid.*']);
    Ext.onReady(function() {
        // wrapped in closure to prevent global vars.
        Ext.define('Restaurant', {
            extend: 'Ext.data.Model',
            fields: ['name', 'cuisine']
        });
    
        var restaurants = Ext.create('Ext.data.Store', {
            storeId: 'restaraunts',
            model: 'Restaurant',
            groupField: 'cuisine',
            sorters: ['cuisine', 'name'],
            data: [{
                name: 'Cheesecake Factory',
                cuisine: 'American'
            }, {
                name: 'Buca di Beppo',
                cuisine: 'Italian'
            }, {
                name: 'Hyderabad House',
                cuisine: 'Indian'
            }, {
                name: 'Starbucks',
                cuisine: 'Coffee'
            }, {
                name: 'Peet\'s Coffee',
                cuisine: 'Coffee'
            }, {
                name: 'Coupa Cafe',
                cuisine: 'Coffee'
            }, {
                name: 'Lytton Coffee Company',
                cuisine: 'Coffee'
            }, {
                name: 'Il Fornaio',
                cuisine: 'Italian'
            }]
        });
    
        var groupingFeature = Ext.create('Ext.grid.feature.Grouping', {
            groupHeaderTpl: '{columnName}: {name} ({rows.length} Item{[values.rows.length > 1 ? "s" : ""]})',
            hideGroupedHeader: true,
        });
    
        var grid = Ext.create('Ext.grid.Panel', {
            renderTo: Ext.getBody(),
            store: restaurants,
            width: 600,
            height: 400,
            features: [groupingFeature],
            columns: [Ext.create('Ext.grid.RowNumberer'), {
                text: 'Name',
                flex: 1,
                dataIndex: 'name'
            }, {
                text: 'Cuisine',
                flex: 1,
                dataIndex: 'cuisine'
            }]
        });
    });
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

Tags for this Thread

Posting Permissions

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