我正在使用 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() 语句，错误仍然会发生。