Question

我正在使用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();

每个案例块中的

语句。我想这是指菜单项，而不是菜单。点击每个项目后，我需要隐藏菜单。但是，即使我注释掉this.hide（）语句，错误仍然会发生。

Answer 1

我在代码中包含了旧版本的prototype.js，这些版本与使用Ext 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

EXT JS 3 - this.focusEl是未定义的错误onClick of columnGrid标头

1 个答案: