Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Ext JS Premium Member
    Join Date
    Aug 2009
    Posts
    30
    Vote Rating
    -1
    tavm is an unknown quantity at this point

      -1  

    Default [CLOSED]Grid grouped header, columns not aligned

    [CLOSED]Grid grouped header, columns not aligned


    Found a display error when setting hidden: true in multiple headers. See below, toggle hidden where indicated. If anyone can identify a workaround I would love to see it. Thanks!

    Code:
    var grid = Ext.create('Ext.grid.Panel', {
     store: Ext.create('Ext.data.ArrayStore',{
      fields: [
       {name: 'a'},
       {name: 'b'},
       {name: 'c'},
       {name: 'd'}
      ],
      data: [
       ['a','b','c','d'],
       ['a','b','c','d'],
       ['a','b','c','d']
      ]
     }),
     columns: [{
      text: 'column group',
      columns: [{
       text: 'column a',
       dataIndex: 'a'
      }, {
       text: 'column b',
       hidden: true,
       dataIndex: 'b'
      }, {
       text: 'column c',
       dataIndex: 'c',
       hidden: true//<---TOGGLE ME
      }]
     }, {
      text: 'column d',
      dataIndex: 'd'
     }],
     height: 350,
     width: 600,
     title: 'grid',
     renderTo: 'grid-example'
    });

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,803
    Vote Rating
    605
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    The issue has already been resolved and will be part of 4.0.2. In the interim you can use this override:

    Code:
    Ext.grid.column.Column.override({
        setSize: function(width, height) {
            var me = this,
                headerCt = me.ownerCt,
                ownerHeaderCt = me.getOwnerHeaderCt(),
                siblings,
                len, i,
                oldWidth = me.getWidth(),
                newWidth = 0,
                readyForSizing = true,
                hidden,
                sibling;
    
            if (width !== oldWidth) {
    
                // Bubble size changes upwards to group headers
                if (headerCt.isGroupHeader) {
                    siblings = headerCt.items.items;
                    len = siblings.length;
                    
                    /*
                     * setSize will be called for each column as it's rendered
                     * so we want to wait until all sub columns have been rendered
                     * before we try and calculate the size of the outer container.
                     * We also take into account hidden columns, because they won't
                     * be rendered, but we'll still need to make the calculation.
                     */
                    for (i = 0; i < len; i++) {
                        sibling = siblings[i];
                        hidden = sibling.hidden;
                        if (!sibling.rendered && !hidden) {
                            readyForSizing = false;
                            break;
                        }
                        if (!hidden) {
                            newWidth += (sibling === me) ? width : sibling.getWidth();
                        }
                    }
                    
                    if (readyForSizing) {
                        headerCt.minWidth = newWidth;
                        headerCt.setWidth(newWidth);
                    }
                }
                me.callParent(arguments);
            }
        }
    });
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  3. #3
    Ext JS Premium Member
    Join Date
    Aug 2009
    Posts
    30
    Vote Rating
    -1
    tavm is an unknown quantity at this point

      0  

    Default


    The override works fine unless forceFit: true is added, then the same error occurs. Not sure if the override is a copy of the changes that are made in 4.0.2.

  4. #4
    Ext JS Premium Member
    Join Date
    Aug 2009
    Posts
    30
    Vote Rating
    -1
    tavm is an unknown quantity at this point

      0  

    Default


    Seeing this issue again in 4.0.6.

  5. #5
    Ext JS Premium Member
    Join Date
    Aug 2009
    Posts
    30
    Vote Rating
    -1
    tavm is an unknown quantity at this point

      0  

    Default


    Error can be recreated in 4.0.6 with original example, do I need to create a new thread or can we reopen this one?

  6. #6
    Sencha User
    Join Date
    Oct 2007
    Posts
    13
    Vote Rating
    0
    isglass is on a distinguished road

      0  

    Default Same here

    Same here


    Just updated to 4.0.6 and it really messed my grouped headers up. Any fix?

  7. #7
    Ext JS Premium Member
    Join Date
    Oct 2011
    Location
    Brussels
    Posts
    10
    Vote Rating
    0
    nikadod is on a distinguished road

      0  

    Default


    Indeed, grouped headers do not seem to be sized properly with forceFit: true.
    Is there any fix on it available?

Thread Participants: 3

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi