Question

I use the jQuery contextMenu from Rodney Rehm in an SVG graphic. It works fine for basic usage.

But I need to get the ID (or any other property) of the SVG-Element which triggered the context menu to use it in the context menu’s item list to get dynamic item names.

I work with the Simple Context Menu demo and now want to replace these static menu items with dynamic ones depending on the ID of the SVG element which was clicked on.

Answer 1

This may help you: http://medialize.github.com/jQuery-contextMenu/demo/dynamic-create.html
Here’s some sample code:

$(function(){
    $.contextMenu({
        selector: 'my-selector-here', 
        build: function($trigger, e) {
            // this callback is executed every time the menu is to be shown
            // its results are destroyed every time the menu is hidden
            // e is the original contextmenu event, containing e.pageX and e.pageY (amongst other data)
            // $trigger is the element that was rightclicked on - get its id here
            var id = $trigger.getTheIDSomehow()
            // build the menu items
            if (id == 1) {
              menuItems = {...}
            else if (id == 2)
              menuItems = {...}
            return {
                callback: function(key, options) {
                    // this is called when one of the contextmenu options is clicked
                },
                items: menuItems
            };
        }
    });
});