Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Feb 2008
    Posts
    36
    Vote Rating
    0
    johnrembo is on a distinguished road

      0  

    Default Ext.layout.container.Table - rowspan/colspan bug

    Ext.layout.container.Table - rowspan/colspan bug


    Raw html code and Ext code comparison:


    an "ok" example:
    HTML Code:
      <table width=300 height=200 border=1>
        <tr>
            <td colspan=2 rowspan=3>A1:B3</td>
            <td>C1</td>
        </tr>
        <tr>
            <td>C2</td>
        </tr>
        <tr>
            <td>C3</td>
        </tr>
      </table>
    and a buggy Ext code:
    PHP Code:
    if (typeof(P)=='object'Ext.destroy(P);

    var 
    PExt.create('Ext.panel.Panel', {
            
    title'Table Layout',
            
    width300,
            
    height200,
            
    layout: {
                
    type'table',
                
    columns3
            
    },
            
    defaults: {
                
    bodyStyle:'padding:20px'
            
    },
            
    items: [{
                
    html'A1:B3',
                
    colspan:2,
                
    rowspan:3
            
    },{
                
    html'C1'
            
    },{
                
    html'C2'
            
    },{
                
    html'C3'
            
    }],
            
    renderToExt.getBody()
        }); 
    and a temporary nasty fix (add an empty cell before "C3")
    PHP Code:
    var PExt.create('Ext.panel.Panel', {
            
    title'Table Layout',
            
    width300,
            
    height200,
            
    layout: {
                
    type'table',
                
    columns3
            
    },
            
    defaults: {
                
    bodyStyle:'padding:20px'
            
    },
            
    items: [{
                
    html'A1:B3',
                
    colspan:2,
                
    rowspan:3
            
    },{
                
    html'C1'
            
    },{
                
    html'C2'
            
    },{border:false},{
                
    html'C3'
            
    }],
            
    renderToExt.getBody()
        }); 

    tested with Extjs 4.0.2a

  2. #2
    Sencha User
    Join Date
    Jan 2008
    Posts
    1
    Vote Rating
    0
    tsoukw is on a distinguished road

      0  

    Default my calculate table layout

    my calculate table layout


    Code:
        function calTableLayout(items,columnCount) {
            var rows = [];                          //return tr list
            var rows_cells_minus = [];              //must minus cell count in row
            
            //init the first row
            var currentRowIndex = 0;                //current row index
            var currentRowCellsTotal = columnCount; //current row remain cells count
            rows[0] = [];
            
            var len = items.length;
            for(var i=0;i<len;i++){
                var item = items[i];
                var colspan = item.colspan || 1;
                //keep right colspan
                if(colspan > currentRowCellsTotal){
                    colspan = currentRowCellsTotal;
                }
                var rowspan = item.rowspan || 1;
                if(rowspan>1){
                    for(var j=1;j<rowspan;j++){     //add minus cells for the next rows
                        if(!rows_cells_minus[currentRowIndex+j]){
                            rows_cells_minus[currentRowIndex+j] = 0;
                        }
                        rows_cells_minus[currentRowIndex+j] += colspan;     //not 1,extjs bug here
                    }
                }
                rows[currentRowIndex].push({rowspan:rowspan,colspan:colspan,item:item});
                currentRowCellsTotal -= colspan;
                if(currentRowCellsTotal == 0){
                    currentRowIndex++;
                    rows[currentRowIndex] = [];
                    currentRowCellsTotal = columnCount - (rows_cells_minus[currentRowIndex] || 0);
                }
            }
            return rows;
        }

Thread Participants: 1

Tags for this Thread