javascript - 在图标上显示上下文菜单？

Question

我有一个 Webix 数据表

webix.ui({
  view:"datatable", id:"dtable", data:grid_data,
  columns:[
    {id:"title", adjust:true},
    {id:"more", template:"<icon class='webix_icon fa-cog'></icon>"}
  ]
});

附带的上下文菜单

webix.ui({
  view:"contextmenu",
  data:["More info",  "Edit", "Delete record"],
  click:function(id, context){
    webix.message(id+" on row "+this.getContext().id);
  }
}).attachTo( $$("dtable") );

这是我的片段

想知道是否可以仅在图标上显示上下文菜单？有任何想法吗？谢谢。

Answer 1

在 Webix 文档中，您将找到onBeforeContextMenu事件。使用它，您可以检查列 ID 并防止在其他列上显示上下文菜单：

on:{
    onBeforeContextMenu:function(id, e, node){
        if (id.column !== "more")
            return false;
    }
}

在您的代码段中，该列仅包含图标，因此此解决方案可以满足您的需求。另外，我建议您通过以下方式阻止数据表上的浏览器上下文

webix.event($$("dtable").$view, "contextmenu", function(e){  
    webix.html.preventEvent(e);
});

http://webix.com/snippet/509f218d