Question

我的剑道ui中有一个网格。我还有一个标题上下文菜单。现在我想要做什么我。当我右键单击标题并选择隐藏此列时，我希望该列（点击右键单击）隐藏。

菜单：

<ul class ="Menu" id="contextmenu" style=" display:none; position: absolute; background-color:white; border-style:solid; border-width:1px;" >
<li id="hideCol">Hide This Column</li>
<li>show hidden columns</li>

菜单并隐藏此列功能：

 $(document).ready(function() {

        $("table tr").bind('contextmenu', function(event) {
            $("#contextmenu").css({ "top": event.pageY + "px", "left": event.pageX + "px" }).kendoMenu({ orientation: "vertical" }).show();
            event.preventDefault();
        });

        $(document).bind('click', function() {
            $("#contextmenu").hide();
        });
    });

    $("#hideCol").click(function () {
        // Get reference to the Grid
        var grid = $("#Grid").data("kendoGrid");
        // Get th cell index
        var idx = $("table tr").index();
        // Hide column
        grid.hideColumn(idx);
        //$("#Grid").data("kendoGrid").hideColumn();

    });

Answer 1

假设您的网格ID为grid，您需要做的是找到列的索引并调用hideColumn。

假设elem是您右键单击的表头（th）元素：

// Get reference to the Grid
var grid = $("#grid").data("kendoGrid");
// Get th cell index
var idx = $(elem).index();
// Hide column
grid.hideColumn(idx);

要查看它的实际效果，请右键单击以下示例的标题：http://jsfiddle.net/OnaBai/9x3H9/

如何制作＆＃34;隐藏此专栏＆＃34;按键

1 个答案: