按条件显示剑道 UI 树视图的上下文菜单答案

【问题标题】：Showing context menu for kendo UI treewiew by condition按条件显示剑道 UI 树视图的上下文菜单
【发布时间】：2015-02-25 21:18:26
【问题描述】：

我有一个 kendo UI treewiew，它代表了一些目录结构和上下文菜单：

 @(Html.Kendo().ContextMenu()
    .Name("menu")
    .Target("#treeview")
    .Orientation(ContextMenuOrientation.Horizontal)
    .Animation(animation => animation.Open(open =>
    {
        open.Fade(FadeDirection.In);
        open.Duration(500);
    }))
    .Items(items =>
    {
        items.Add()
            .Text("Test");

    })
    //.Events(e=>e.Open("contextOpen"))
)


<div class="treeview-back">
    @(Html.Kendo().TreeView()
        .Name("treeview")
        .TemplateId("treeview-template")
        .Checkboxes(checkboxes => checkboxes
            .Name("checkedFiles")
            .CheckChildren(true)
        )
        .Events(events => events
            .Check("onCheck")
        )
        .DataTextField("Name")
        .DataSource(dataSource => dataSource
        .Model(m => m.Id("Path").HasChildren("HasChildren"))
        .Read("ReadDirectory", "Download"))   
    )

我只需要为代表文件夹的元素显示上下文菜单。但我找不到按条件显示剑道上下文菜单的方法。我添加了右键捕获方法，如下所示：

$("#treeview").on('mousedown', '.k-item', function (event) {
            var treeView = $('#treeview').data('kendoTreeView');
            var dataSource = treeView.dataSource;
            var itemUId = $(this).attr("data-uid");
            var node = dataSource.getByUid(itemUId);
            if (event.which === 3 && node.hasChildren) {
                event.stopPropagation(); // to avoid propagation of this event to the root of the treeview
                $('#treeview').data('kendoTreeView').select(this);
                ...//here I should prevent context menu from showing somehow
            }
        });

但我找不到取消上下文菜单显示的方法。我还尝试将打开事件添加到上下文菜单，但我无法在那里选择项目。提前致谢。

【问题讨论】：

标签： javascript jquery razor model-view-controller kendo-ui

【解决方案1】：

使用 ContextMenu 对象的 filter 属性来显示菜单：

@(Html.Kendo().ContextMenu()
    .Name("menu")
    .Filter(".menu-on")
)

它只显示类别为menu-on 的项目的菜单。

其次，您必须将此类添加到所有文件夹中。您应该通过 javascript 在树中找到所有 <span class="k-in"> 元素，并将 menu-on 类添加到与文件夹关联的所有元素中。

【讨论】：