PDA

View Full Version : [FIXED] Button menu misaligned on first appear, correct on second appear



preaction
4 Oct 2011, 9:57 AM
The button menu is not aligned according to the menuAlign config the first time the menu is rendered. The second time the menu appears, the menu is in its correct place.

This does not seem to happen if the menu is a direct child of the viewport in Firefox (in IE7, makes no difference where the menu is).

ExtJS version: 4.0.6
Browsers: Firefox 7.0.1 and IE 7.0.5730
OS: Windows XP



<html>
<head>
<link type="text/css" rel="stylesheet" href="/static/js/ext-4.0/resources/css/ext-all.css" />
</head>
<body>
<script type="text/javascript" src="/static/js/ext-4.0/ext-all-debug.js"></script>
<script type="text/javascript">
Ext.Loader.setConfig({enabled: true});
Ext.onReady( function() {
var port, menuItems;

menuItems = [
{ text : 'Giant Step' },
{ text : 'Lilliput Steps' },
{ text : 'Milky Well' },
{ text : 'Rainy Circle' },
{ text : 'Magnet Hill' },
{ text : 'Pink Cloud' },
{ text : 'Lumine Hall' },
{ text : 'Fire Circle' }
];

port = Ext.create( 'Ext.Viewport', {
renderTo : Ext.getBody(),
layout : 'border',
items : [
{
region : 'north',
xtype : 'button',
text : 'Aligned Correctly in Firefox',
menuAlign : 'tr-br?',
menu : {
items : menuItems
}
},
{
region : 'west',
items : [
{
xtype : 'button',
text : 'Add a row',
handler : function () {
addField();
}
}
]
},
{
itemId : 'one',
region : 'center',
layout : 'anchor',
items : [
]
}
]
} );

function addField() {
port.down('#one').add({
xtype : 'fieldcontainer',
text : 'Panel',
layout : 'hbox',
items : [
{
xtype : 'tbspacer',
flex : 1
},
{
xtype : 'button',
text : 'Bad',
menuAlign : 'tr-br?',
menu : {
items : menuItems
}
},
{
xtype : 'tbspacer',
width : 40
}
]
} );
}

addField();
} );

</script>
</body>
</html>

mdlincoln
4 Oct 2011, 12:09 PM
We have confirmed this issue and created a bug report for it.