Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User steffenk's Avatar
    Join Date
    Jul 2007
    Location
    Haan, Germany
    Posts
    2,663
    Vote Rating
    6
    steffenk has a spectacular aura about steffenk has a spectacular aura about steffenk has a spectacular aura about

      0  

    Default [OPEN-807] Table layout bug

    [OPEN-807] Table layout bug


    Ext version tested:
    • Ext 3.0 - 3.2

    Adapter used:
    • ext

    css used:
    • only default ext-all.css



    Description:
    I set up a table layout with 4x3 cells and combined colspan and rowspan. But the result is not the expected one. This is how it should be:

    Code:
    +--------+--------|--------|--------+
    |   1             |    2   |    3   |
    |--------|--------|--------|        |
    |   4    |    5            |        |
    |--------|                 |--------|
    |   6    |                 |    7   |
    +--------+--------|--------|--------+
    Here is the code
    Code:
    Ext.onReady(function() {
    
    	new Ext.Panel({
    		renderTo: 'table',
    		baseCls:'x-plain',
    		layout:'table',
    		layoutConfig: {
    			columns: 4
    		},
    		defaults: {
    			frame: false,
    			unstyled: true,
    			width: 150,
    			height: 150
    		},
    		items:[{
    					colspan: 2,
    					width: 300,
    					style: 'background: #00ee00',
    					id: 'hppanel-1',
    					html: 'hppanel-1'
    				},{
    					style: 'background: #ee0000',
    					id: 'hppanel-2',
    					html: 'hppanel-2'
    				},{
    					rowspan: 2,
    					height: 300,
    					style: 'background: #0000ee',
    					id: 'hppanel-3',
    					html: 'hppanel-3'
    				},{
    					style: 'background: #00aa00',
    					id: 'hppanel-4',
    					html: 'hppanel-4'
    				},{
    					colspan: 2,
    					rowspan: 2,
    					width: 300,
    					height: 300,
    					style: 'background: #aa0000',
    					id: 'hppanel-5',
    					html: 'hppanel-5'
    				},{
    					style: 'background: #0000aa',
    					id: 'hppanel-6',
    					html: 'hppanel-6'
    				},{
    					style: 'background: #234567',
    					id: 'hppanel-7',
    					html: 'hppanel-7'
    				}]
    
    		});
    
    });
    See this URL : http://dev.sk-typo3.de/ext/table.html


    One thing that isn't related direct, but i think it's unneccesary: If i have a default width of 150 for each column, and i make colspan:2, i would expect that Ext automatically assign 300. This is not the case, i have to define width: 300.
    So without defining specific width it should be easy to calculate defaultWidth * colspan
    vg Steffen
    --------------------------------------
    Release Manager of TYPO3 4.5

  2. #2
    Sencha User steffenk's Avatar
    Join Date
    Jul 2007
    Location
    Haan, Germany
    Posts
    2,663
    Vote Rating
    6
    steffenk has a spectacular aura about steffenk has a spectacular aura about steffenk has a spectacular aura about

      0  

    Default


    I must say i'm bit clueless. Debugging shows correct counting of cells/rows, DOM looks total correct to me. I can't understand why td with hppanel4 has a width of 300px. I tried to correct that with FB, but even if i remove nearly all dimensions it stays wrong.
    vg Steffen
    --------------------------------------
    Release Manager of TYPO3 4.5

  3. #3
    Sencha User steffenk's Avatar
    Join Date
    Jul 2007
    Location
    Haan, Germany
    Posts
    2,663
    Vote Rating
    6
    steffenk has a spectacular aura about steffenk has a spectacular aura about steffenk has a spectacular aura about

      0  

    Default


    you can laugh at me, but i built the table with dreamweaver now to see how it works. i saw that the result was only possible if the table gets the complete width. if i remove this, i get the same result as with above blanc table.

    I implemented it in online demo, see link from first post.
    vg Steffen
    --------------------------------------
    Release Manager of TYPO3 4.5

  4. #4
    Sencha - Sencha Touch Dev Team Jamie Avins's Avatar
    Join Date
    Mar 2007
    Location
    Redwood City, California
    Posts
    3,661
    Vote Rating
    20
    Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough

      0  

    Default


    Doesn't surprise me, table layout is very passive and just puts things in a standard HTML table.

  5. #5
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,353
    Vote Rating
    80
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    Confirmed.


    This example is much lighter weight and demonstrates the problem:

    Code:
    new Ext.Window({
        resizable : false,
        layout:'table',
        layoutConfig: {
            columns: 3
        },
        defaults: {
            border: true,
            width: 75,
            height: 75
        },
        items:[
            {
    
                html: 'hppanel-1 (cspan 2)',
                colspan: 2,
                width: 150,
                style: 'background: #00ee00'
            },
            {
                html: 'hppanel-2',
                style: 'background: #ee0000'
            },
            {
                html: 'hppanel-3',
                style: 'background: #00aa00'
    
            },
            {
                html: 'hppanel-4 (cspan 2)',
                colspan: 2,
                width: 150,
                style: 'background: #aa0000'
            }
        ]
    }).show()

  6. #6
    Sencha User tobiu's Avatar
    Join Date
    May 2007
    Location
    Munich (Germany)
    Posts
    2,669
    Vote Rating
    110
    tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all

      0  

    Default


    confirmed too after this debugging session without result


    kind regards,
    tobiu
    Best regards
    Tobias Uhlig
    __________

    S-CIRCLES Social Network Engine

  7. #7
    Sencha User steffenk's Avatar
    Join Date
    Jul 2007
    Location
    Haan, Germany
    Posts
    2,663
    Vote Rating
    6
    steffenk has a spectacular aura about steffenk has a spectacular aura about steffenk has a spectacular aura about

      0  

    Default


    reminder
    vg Steffen
    --------------------------------------
    Release Manager of TYPO3 4.5

  8. #8
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,781
    Vote Rating
    599
    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


    I'm not really sure this classifies as a bug. As you said, you're explicitly setting the width of the panel to 150. If you just remove the default and let them size themselves, it appears as you would expect.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  9. #9
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,498
    Vote Rating
    46
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Certainly Jay's example is not a bug, it's user error. You are asking it to do the impossible.

    Column count is 3, so with the colspan, that means the first two items on the top row.

    Then how can that top-left cell then span two columns? There's the first cell on the lower row, but then there's the second one which ITSELF must span two columns from above! It can't be done.

  10. #10
    jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    Frederick MD, NYC, DC
    Posts
    16,353
    Vote Rating
    80
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    Quote Originally Posted by Animal View Post
    Certainly Jay's example is not a bug, it's user error. You are asking it to do the impossible.

    Column count is 3, so with the colspan, that means the first two items on the top row.

    Then how can that top-left cell then span two columns? There's the first cell on the lower row, but then there's the second one which ITSELF must span two columns from above! It can't be done.
    Nige,

    have you seen the source to http://dev.sk-typo3.de/ext/table.html ? Look at the HTML table. You'll see that it can be.

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..."