You found a bug! We've classified it as EXTJS-9327 . We encourage you to continue the discussion and to find an acceptable workaround while we work on a permanent fix.
  1. #1
    Sencha User
    Join Date
    Mar 2013
    Posts
    1
    Vote Rating
    0
    zhulijun is on a distinguished road

      0  

    Default grouped header grid issue

    grouped header grid issue


    I have defined a grouped header grid as below.
    However, something is wrong as the attached image.
    I'm using Ext JS 4.1

    Please help,
    Thanks,
    zhu


    grid.png


    code:
    Code:
    
    
    Code:
    Ext.onReady(function() {
        Ext.QuickTips.init();
    
    
        var myData = [[1, '3m Co', 71.72, 0.02, 0.03, '9/1 12:00am', 'Category 1', 'Country 1', 0]
        , [2, 'Alcoa Inc', 29.01, 0.42, 1.47, '9/1 12:00am', 'Category 2', 'Country 10', 0]
        , [3, 'Altria Group Inc', 83.81, 0.28, 0.34, '9/1 12:00am', 'Category 3', 'Country 9', 0]];
    
    
        //
        var fields = [{
            "name" : "RD4434",
            "type" : "float"
        }, {
            "name" : "RD4435",
            "type" : "string"
        }, {
            "name" : "RD4436",
            "type" : "float"
        }, {
            "name" : "RD4418",
            "type" : "float"
        }, {
            "name" : "RD4419",
            "type" : "float"
        }, {
            "name" : "RD4420",
            "type" : "float"
        }, {
            "name" : "RD4421",
            "type" : "string"
        }, {
            "name" : "RD4422",
            "type" : "string"
        }, {
            "name" : "RD4427",
            "type" : "float"
        }, {
            "name" : "RD4428",
            "type" : "float"
        }, {
            "name" : "TD0506",
            "type" : "float"
        }];
    
    
        var columns = [{
            "filter" : false,
            "text" : "g01",
            "columns" : [{
                "filter" : false,
                "text" : "g0101",
                "columns" : [{
                    "sortable" : true,
                    "align" : "center",
                    "dataIndex" : "RD4418",
                    "text" : "i010101",
                    "width" : 100
                }]
            }, {
                "filter" : false,
                "text" : "g0101",
                "columns" : [{
                    "filter" : false,
                    "text" : "g010201",
                    "columns" : [{
                        "sortable" : true,
                        "align" : "center",
                        "dataIndex" : "RD4421",
                        "text" : "i01020101",
                        "width" : 100
                    }]
                }]
            }]
        }, {
            "filter" : false,
            "text" : "g02",
            "columns" : [{
                "filter" : false,
                "text" : "g0201",
                "columns" : [{
                    "sortable" : true,
                    "align" : "center",
                    "dataIndex" : "RD4436",
                    "text" : "i020101",
                    "width" : 100
                }]
            }]
        }, {
            "filter" : false,
            "text" : "g03",
            "columns" : [{
                "sortable" : true,
                "align" : "center",
                "dataIndex" : "RD4427",
                "text" : "i0301",
                "width" : 100
            }]
        }, {
            "filter" : false,
            "text" : "g04",
            "columns" : [{
                "filter" : false,
                "text" : "g0401",
                "columns" : [{
                    "filter" : false,
                    "text" : "g040101",
                    "columns" : [{
                        "filter" : false,
                        "text" : "g04010101",
                        "columns" : [{
                            "filter" : false,
                            "text" : "g0401010101",
                            "columns" : [{
                                "sortable" : true,
                                "align" : "center",
                                "dataIndex" : "RD4428",
                                "text" : "i040101010101",
                                "width" : 100
                            }]
                        }]
                    }]
                }]
            }]
        }, {
    
    
            "sortable" : true,
            "align" : "center",
            "dataIndex" : "TD0506",
    
    
            "text" : "i05",
            "width" : 100
        }];
        // create the data store
        var store = Ext.create('Ext.data.ArrayStore', {
            fields : fields,
            data : myData
        });
    
    
        // create the Grid
        var grid = Ext.create('Ext.grid.Panel', {
            store : store,
            columns : columns,
            title : 'Multiple header',
            viewConfig : {
                stripeRows : true
            }
        });
        Ext.widget('viewport', {
            layout : 'fit',
            items : [grid]
        });
    
    
    });
    
    
    
    


  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,330
    Vote Rating
    846
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Looks like the framework isn't calculating the header sizing properly. Will open a bug for this.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

Thread Participants: 1

Tags for this Thread