PDA

View Full Version : [OPEN-1010]Menu position bug when adding/removing items



danh2000
28 Sep 2009, 4:10 PM
Ext version tested:

Ext 3.0.0+


Adapter used:

ext


css used:

only default ext-all.css


Browser versions tested against:

All


Operating System:

Vista


Description:

After adding and/or removing items from a menu, show fails to position the menu correctly.


Test Case:



var btn, state, menu, showMenu = function(e){
e.stopEvent();

if(!menu){
menu = new Ext.menu.Menu();
}
menu.removeAll();
menu.addItem({
text: 'One'
});
menu.addItem({
text: 'Two'
});
if(state === 1){
state = 0;
menu.addItem({
text: 'Three'
});
}else{
state = 1;
}

menu.show(btn.getEl(),'bl-tl');

};
Ext.onReady(function(){

new Ext.Viewport({
layout:'border',
items: [
new Ext.Panel({
id: 'centerPanel',
region: 'center',
title: 'Center',
bbar : new Ext.Toolbar({
enableOverflow : false,
items: [
btn = new Ext.Button({
text: 'Right Click Me'
})
]
})
})
]
});

btn.getEl().on('contextmenu', showMenu);

});


See this URL : http://


Steps to reproduce the problem:

Right click the toolbar button, to display a context menu.
Allow the menu to close.
Right click the toolbar button, to display the context menu.


The result that was expected:

Menu should be positioned (aligned) correctly ('bl-tl').


The result that occurs instead:

Menu is not positioned correctly.


Screenshot:

16488

danh2000
28 Sep 2009, 7:47 PM
I just realised, this also occurs on a standard menu button.

Animal
29 Sep 2009, 2:21 AM
I think it is because the relaying of the element is now deferred in Ext 3.0 using Ext.Container.prototype.bufferResize

So even though the Menu has autoLayout == true to relay itself on every addition/removal, the showAt occurs before the new layout is performed.

Menu probably needs bufferResize to be false in its prototype.

In fact if autoLayout is true, bufferResize should be overriden, and relaying should be immediate. This is what autoLayout implies.

Animal
29 Sep 2009, 2:26 AM
So ContainerLayout should have



onResize: function(){
var ct = this.container,
b;

if(ct.collapsed){
return;
}
// Buffer resize operations unless autoLayout is set.
if(b = ct.autoLayout ? false : Ext.num(ct.bufferResize, 50)){
// Only allow if we should buffer the layout
if(ct.shouldBufferLayout()){
if(!this.resizeTask){
this.resizeTask = new Ext.util.DelayedTask(this.runLayout, this);
this.resizeBuffer = b;
}
ct.layoutPending = true;
this.resizeTask.delay(this.resizeBuffer);
}
}else{
ct.doLayout();
}
},

evant
29 Sep 2009, 2:36 AM
It's not just that. It's also because constrainScroll sets the size of the ul, which means when it goes to grab the anchor points the xy is wrong.

damo
27 May 2010, 7:42 AM
Is there a workaround for this?

This is the only post I've managed to find on this.

Cheers,
Damo

damo
30 May 2010, 12:18 AM
Managed to get a hacky fix working.

I'm simply calling showMenu and hideMenu on the parent button one anything changes on the menu. The next bug is that menu doesn't know it's ownerCt so I am having to call the button via and ID which isn't great in my menu extension.