open

Fires before a sub menu or the ContextMenu gets opened. You can cancel this event to prevent opening the sub menu.

Event Data

e.item Element

The opened item

e.type String

The event type as a string - "open".

e.target Element

The current target of the ContextMenu - either the init target or the current element chosen through filter, if specified.

e.event jQuery.Event

The jQuery event that triggered this one - only available for the open event of the whole ContextMenu and not for its items.

Example

<div id="target">Target</div>
<input type="checkbox" id="cbx"/> Prevent the `open` event
<ul id="context-menu">
    <li>Item 1
        <ul>
            <li>Sub Item 1</li>
            <li>Sub Item 2</li>
            <li>Sub Item 3</li>
        </ul>
    </li>
    <li>Item 2
        <ul>
            <li>Sub Item 1</li>
            <li>Sub Item 2</li>
            <li>Sub Item 3</li>
        </ul>
    </li>
</ul>
<script>
    $("#context-menu").kendoContextMenu({
        target: "#target",
        open: function(e) {
            if($('#cbx').is(':checked')){
                e.preventDefault();
            }
        }
    });
</script>

To set after initialization

<div id="target">Target</div>
<ul id="context-menu">
    <li>Item 1
        <ul>
            <li>Sub Item 1</li>
            <li>Sub Item 2</li>
            <li>Sub Item 3</li>
        </ul>
    </li>
    <li>Item 2
        <ul>
            <li>Sub Item 1</li>
            <li>Sub Item 2</li>
            <li>Sub Item 3</li>
        </ul>
    </li>
</ul>
<script>
    // initialize the ContextMenu
    $("#context-menu").kendoContextMenu({
        target: "#target"
    });
     // get a reference to the ContextMenu widget
     var contextMenu = $("#context-menu").data("kendoContextMenu");
     // bind to the open event
     contextMenu.bind("open", function(e) {
         // handle event
     });
</script>
In this article