如何在网格中显示菜单 - ExtJS 5? [英] How to show a menu in a grid - ExtJS 5?
问题描述
我正在尝试在网格面板中显示菜单.我有一个显示图标的操作列,我想应用效果...当鼠标悬停在该图标上时,将显示一个菜单.
I am trying to show a menu in a grid panel. I have a actioncolumn to display an icon and i want apply an effect... when the mouse is over that icon, a menu will be displayed.
如何在 extjs 5 中做到这一点?
How i can do this in extjs 5?
我的操作栏是这样的:
{
xtype: 'actioncolumn',
width: 70,
items: [{
icon: 'resources/images/icons/cog_edit.png', // Use a URL in the icon config
tooltip: 'Edit',
handler: function(grid, rowIndex, colIndex, a, b, c) {
}
}]
}
推荐答案
参考这个post 我在评论中提到,您的解决方案可能如下所示:
Referring to this post that I mentioned in the comments, your solution may look something like this:
var menu_grid = new Ext.menu.Menu({
items: [
{ text: 'Add', handler: function() {console.log("Add");} },
{ text: 'Delete', handler: function() {console.log("Delete");} }
]
});
...
{
xtype: 'actioncolumn',
width: 70,
items: [{
icon: 'resources/images/icons/cog_edit.png', // Use a URL in the icon config
tooltip: 'Edit',
handler: function(grid, rowIndex, colIndex, item, e, record) {
var position = e.getXY();
e.stopEvent();
menu_grid.showAt(position);
}
}]
}
编辑:小心创建这样的项目,当它们被隐藏时,它们不会被完全删除并可能导致内存泄漏,请参阅此 post 了解更多信息和可能的解决方法/解决方案.
EDIT: Be careful creating items like this, when they are hidden they are not removed completely and can cause memory leaks, refer to this post for further information and possible workarounds/solutions.
这篇关于如何在网格中显示菜单 - ExtJS 5?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!