Extjs Ext.MessageBox.show will not vertical align with y:

Question

I have a grid with a toolbar. This toolbar has an item that is a button to delete an entry from the grid's store.

I would like to vertically align the confirmation messagebox on 200 pixels from te top.

According to the documentation (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.window.MessageBox-cfg-y) there is a config called 'y' to get this done. But it is not working for me. Hope you guys can help.

I'm using Extjs 4.1.1a

Here is my code:

var entryGridToolbar = Ext.create('Ext.toolbar.Toolbar', {
    items: [{
        text: 'Delete',
        id: 'deleteButton',
        icon: '/images/icons/minus.png',
        handler: function() {
            Ext.MessageBox.show({
                title: 'Delete entry',
                width: 300,
                y: 200,
                msg: 'Are you sure?',
                buttons: Ext.MessageBox.YESNO,
                icon: Ext.MessageBox.QUESTION,
                fn: function(btn) {
                    // delete/cancel..
                }
            })
        }
    }]
});

Answer 1

var msgBox; // declare it global
var entryGridToolbar = Ext.create('Ext.toolbar.Toolbar', {
    items: [{
        text: 'Delete',
        id: 'deleteButton',
        icon: '/images/icons/minus.png',
        handler: function() {
            msgBox = Ext.MessageBox.show({
                title: 'Delete entry',
                width: 300,
                y: 200,
                msg: 'Are you sure?',
                buttons: Ext.MessageBox.YESNO,
                icon: Ext.MessageBox.QUESTION,
                fn: function(btn) {
                    // delete/cancel..
                }
            })
        }
    }]
});

msgBox.getDialog().getPositionEl().setTop(50); // Try this 
msgBox.getPositionEl().setTop(50); // Try this if above dosen't work

Also refer this link Ext JS Message Box Position