Search code examples
extjs4internet-explorer-11

Extjs 4 panel Column width issue on IE

I am working on extjs 4,

I have a grid panel like this enter image description here

It works fine on CHROME but on IE 11, the column of grid doesn't render properly. enter image description here

code:

GRID = Ext.create('Ext.grid.Panel', {
        title: 'Popup',
        frame: true,
        selModel: checkboxselection,
        store: Ext.data.StoreManager.lookup('popupStore'),
        scrollable: true,
        columns: _COLS,
        features: [groupingFeature],
        flex: 90,
        autoHeight:true,
        autoWidth:true,
        renderTo: 'details',
        scroll: true,
        viewConfig: {
        style: {

        overflowX: 'hidden'
           }
         },
        listeners: {
            itemclick: function(dv, record, item, index, e) {
            SELECTED_GROUP_VALUE = record.get('GROUP_FIELD');
            if(selectionType =='SINGLE'){
                setValue(getProdId(), record);
            }
        },
        beforeselect: function(grid, record, index, eOpts)  {  },
        groupclick: function (view, node, group, e, eOpts) {  },
        headerclick: function(){                
            }
        },
        onSelectChange: function(record, isSelected, suppressEvent, commitFn) {
            grid = Ext.ComponentQuery.query('#grid-item-id')[0];
            grid.suspendLayout = true;
            this.callParent(arguments);
        }


    });

I have tried viewport and other container bur still facing the same issue..

Could anybody please help. Thanks

Solution

  • try grid config, columnWidths:["100%"]