PDA

View Full Version : [OPEN-365][3.x] GridView must use autoLayout: false on its colum/header Menus



Animal
30 Nov 2009, 8:50 AM
Otherwise it causes a whole load of automatic doLayout calls when it creates and adds the Menu Items.

Fix:



Ext.override(Ext.grid.GridView, {
beforeColMenuShow : function(){
var cm = this.cm, colCount = cm.getColumnCount();
this.colMenu.removeAll();
for(var i = 0; i < colCount; i++){
if(cm.config[i].fixed !== true && cm.config[i].hideable !== false){
this.colMenu.add(new Ext.menu.CheckItem({
itemId: 'col-'+cm.getColumnId(i),
text: cm.getColumnHeader(i),
checked: !cm.isHidden(i),
hideOnClick:false,
disabled: cm.config[i].hideable === false
}));
}
}
this.colMenu.doLayout();
},

renderUI : function(){

var header = this.renderHeaders(),
body = this.templates.body.apply({rows:'&#160;'}),
html = this.templates.master.apply({
body: body,
header: header,
ostyle: 'width:'+this.getOffsetWidth()+';',
bstyle: 'width:'+this.getTotalWidth()+';'
}),
g = this.grid;

g.getGridEl().dom.innerHTML = html;

this.initElements();

// get mousedowns early
Ext.fly(this.innerHd).on('click', this.handleHdDown, this);
this.mainHd.on({
scope: this,
mouseover: this.handleHdOver,
mouseout: this.handleHdOut,
mousemove: this.handleHdMove
});

this.scroller.on('scroll', this.syncScroll, this);
if(g.enableColumnResize !== false){
this.splitZone = new Ext.grid.GridView.SplitDragZone(g, this.mainHd.dom);
}

if(g.enableColumnMove){
this.columnDrag = new Ext.grid.GridView.ColumnDragZone(g, this.innerHd);
this.columnDrop = new Ext.grid.HeaderDropZone(g, this.mainHd.dom);
}

if(g.enableHdMenu !== false){
// Sort options always in header menu
var hmenuItems = [
{itemId:'asc', text: this.sortAscText, cls: 'xg-hmenu-sort-asc'},
{itemId:'desc', text: this.sortDescText, cls: 'xg-hmenu-sort-desc'}
];

if(g.enableColumnHide !== false){
this.colMenu = new Ext.menu.Menu({
id: g.id + '-hcols-menu',
autoLayout: false,
});
this.colMenu.on({
scope: this,
beforeshow: this.beforeColMenuShow,
itemclick: this.handleHdMenuClick
});

// If column hide/show allowed, add the column menu to the header menu.
hmenuItems.splice(2, 2, '-', {
itemId: 'columns',
hideOnClick: false,
text: this.columnsText,
menu: this.colMenu,
iconCls: 'x-cols-icon'
});
}

this.hmenu = new Ext.menu.Menu({
id: g.id + '-hctx',
autoLayout: false,
items: hmenuItems,
listeners: {
itemClick: this.handleHdMenuClick,
scope: this
}
});
}

if(g.trackMouseOver){
this.mainBody.on({
scope: this,
mouseover: this.onRowOver,
mouseout: this.onRowOut
});
}

if(g.enableDragDrop || g.enableDrag){
this.dragZone = new Ext.grid.GridDragZone(g, {
ddGroup : g.ddGroup || 'GridDD'
});
}
this.updateHeaderSortState();
}
});

evant
1 Dec 2009, 5:36 AM
Agreed, though this will need to be tested with the existing ux plugins and others.