This is a migrated thread and some comments may be shown as answers.

Position a context menu

2 Answers 633 Views
Menu
This is a migrated thread and some comments may be shown as answers.
George
Top achievements
Rank 2
George asked on 03 Feb 2015, 09:58 PM
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.

2 Answers, 1 is accepted

Sort by
0
Accepted
Atanas Korchev
Telerik team
answered on 05 Feb 2015, 03:38 PM
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
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
George
Top achievements
Rank 2
answered on 05 Feb 2015, 04:14 PM
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');" });


Tags
Menu
Asked by
George
Top achievements
Rank 2
Answers by
Atanas Korchev
Telerik team
George
Top achievements
Rank 2
Share this question
or