Position a context menu

[George]

I have a bunch of buttons that each bring up the same context menu.  I need the context menu to position itself at the mouse click on the button.

In ASP.NET this is accomplished by using code like this.

function OpenAddRowMenu(event) {

    var contextMenu =  $("#AddRowMenu");

    if ((!event.relatedTarget) || (!$telerik.isDescendantOrSelf(contextMenu.get_element(), event.relatedTarget))) {

        contextMenu.show(event);
    }

    else {

        alert("Event error");

    }

}

The button

<button class="btn btn-primary" onclick="OpenAddRowMenu(event); return false;">Add Row</button>


 
I cannot find anything on positioning a context menu or any possible parameters to show().  The MVC documentation is really thin and the examples only show so much.

[Atanas Korchev]

Hi George,

You can use the open method of the context menu to position it. Here is a demo which shows how to open it when the user clicks over a button: http://dojo.telerik.com/@korchev/AHoYi

Regards,
Atanas Korchev
Telerik

 

 

[George]

It works, thanks. 

$("button").on("mouseup", function(e) {
    var contextMenu = $("#context-menu").data("kendoContextMenu");
     contextMenu.open(e.clientX, e.clientY);
});

Too bad I could not find that in the Kendo documentation where the examples and specifics are pretty non-existent, repeatedly the same giving little information in lots of text.  I knew there was an open but could not find its parameters. Many hours of web searching and bothering Telerik with this post could have been avoided with some documentation that enumerates methods and their parameters, Microsoft manages this pretty well although they provide fewer examples on newer stuff.

In the end I discovered from examples, and trial and error, that .Filter(".classname")  will bring a context menu up on any button  I put the class one that and .ShowOn("click") will use the left button instead of the right.

<%= Html.Kendo().ContextMenu()
.Name("ContextRowMenu")
.CloseOnClick(true)
.Filter(".contextButton")
.ShowOn("click")
.Items(items => {
        items.Add()
                .Text("Edit")
                .LinkHtmlAttributes(new { onclick = "return OnMenuItem('Edit');" });