0

我正在使用 ExtJs 3.2.2。我编写了一个自定义上下文菜单来处理网格的 headerclick 事件。单击标题时出现“this.focusEl is undefined error”错误。我感觉它与上下文菜单中的范围有关,但我很困惑。FF 会优雅降级并仍然显示菜单,但 IE 的行为是不可预测的。

这是网格的 headerclick 事件:

headerclick: function(grid, columnIndex, e) {
    e.stopEvent();
    var colModel = grid.getColumnModel();
    var col = colModel.getColumnById(colModel.getColumnId(columnIndex))
    contextMenu.columnId = col.id;
    contextMenu.headerName = col.header;
    contextMenu.showAt(e.getXY());
}

这是上下文菜单:

var contextMenu = new Ext.menu.Menu({
    items: [{
        id: 'sort-high-to-low',
        cls: 'xg-hmenu-sort-asc',
        text: 'Sort Ascending within Group'
    },{
        id: 'sort-low-to-high',
        cls: 'xg-hmenu-sort-desc',
        text: 'Sort Descending within Group'
    },'-',{
        id: 'sort-high-to-low-all',
        cls: 'xg-hmenu-sort-asc',
        text: 'Sort All Ascending'
    },{
        id: 'sort-low-to-high-all',
        cls: 'xg-hmenu-sort-desc',
        text: 'Sort All Descending'
    },'-',    {
        id: 'heatmap',
        cls: 'xg-hmenu-heatmap',
        text: 'Open in Heatmap'
    }],
    listeners: {
        scope: this, // not sure if this is correct...
        itemclick: function(item) {
            switch (item.id) {
                case 'sort-high-to-low':
                    Ext.getCmp('backtestGrid').getStore().sort(contextMenu.columnId,'ASC');
                    this.hide();
                    break;
                case 'sort-low-to-high':
                    Ext.getCmp('backtestGrid').getStore().sort(contextMenu.columnId,'DESC');
                    this.hide();
                    break;
                case 'sort-high-to-low-all':
                    Ext.getCmp('backtestGrid').getStore().clearGrouping();
                    Ext.getCmp('backtestGrid').getStore().sort(contextMenu.columnId,'ASC');
                    this.hide();
                    break;
                case 'sort-low-to-high-all':
                    Ext.getCmp('backtestGrid').getStore().clearGrouping();
                    Ext.getCmp('backtestGrid').getStore().sort(contextMenu.columnId,'DESC');
                    this.hide();
                    break;
                case 'heatmap':
                    heatmapCallback(contextMenu.headerName, contextMenu.columnId);
                    this.hide();
                    break;
            }
        }
    }
});

第二个问题是当我实际单击其中一个上下文菜单项时。我收到以下错误:

this.fireEvent is not a function

例如,第一项是排序。单击第一项时,FF 会抛出错误但仍然对网格进行排序。IE 不对网格进行排序。

同样,我感觉这个错误与

this.hide();

每个 case 块中的语句。我想这是指菜单项,而不是菜单。单击每个项目后,我需要隐藏菜单。但是,即使我注释掉 this.hide() 语句,错误仍然会发生。

4

1 回答 1

1

我在与 Ext JS 打包的prototype.js 版本冲突的代码中包含了一个旧版本的prototype.js。

我一直在 Firebug 的错误日志中看到对prototype.js 中函数的引用。我用细齿梳理了代码,直到找到参考。我删除了它,没有错误!

Sencha上的解决方案链接:

http://www.sencha.com/forum/showthread.php?138644-this.focusEl-is-undefined-error-on-click-of-columnGrid-header&p=619749

于 2011-06-30T20:37:08.630 回答