EXTJS Context Menu showing up in wrong place

Question

extjs context menu is showing up occaisionally in the wrong place. Top left of screen, sometimes all the way left-middle. A lot of times it shows up fine, but it's showing up in the wrong place enough that it's annoying.

here is the start to my menu code:

grid<?php echo $count; ?>.contextMenu = new Ext.menu.Menu({
id: 'gridCtxMenu<?php echo $count; ?>',
items: [ ...

Here is where i'm attaching the showAt to the menu button "#actions_button;

var action_button = 'actions_button' + <?php echo $count; ?>;

Ext.fly(action_button).on('click', function() {
    var xy = this.getXY();
    xy[1] += this.getHeight();
    grid<?php echo $count; ?>.contextMenu.showAt(xy);

});

Using extjs 3.2, any help is appreciated!

Answer 1

It may be necessary to see the whole code in order to properly analyze the problem.

One possible cause is that Ext.fly writes to a singleton. That is, at the time the 'click' handler is run, the flyweight object points to a different DOM node, not action_button . This means in turn that this.getXY() returns crap.

http://extjs.cachefly.net/ext-3.2.1/docs/?class=Ext#Ext-fly
...the dom node can be overwritten by other code. ... Use this to make one-time references to DOM elements which are not going to be accessed again either by application code, or by Ext's classes.

Use Ext.get(action_button) or Ext.fly(action_button, 'MYNAMESPACE') instead.