Question

I have a jquery function to display a menu on right click event.
I wish to access an object from the parent function inside the callback function.

Am using following JQuery plugin to get the context menu.

Here is the code:

function OnContextMenu() {

     //alert(key + ' ' +this.Node.Content);
     var localNode = this.Node;
     alert(localNode.Content); //CORRECT NODE VALUE GETS ALERTED

        $.contextMenu({
            selector: '.Container', 
            callback: function(key, options) {
                var m = "clicked: " + key;
                 alert(localNode.Content); //ALWAYS PRINTS THE VALUE OF THE VERY FIRST NODE THAT WAS CLICKED. 
                // window.console && console.log(m) || alert(m); 
            },
            items: {
                "edit": {name: "Edit", icon: "edit"},
                "cut": {name: "Cut", icon: "cut"},
                "copy": {name: "Copy", icon: "copy"},
                "paste": {name: "Paste", icon: "paste"},
                "delete": {name: "Delete", icon: "delete"},
                "sep1": "---------",
                "quit": {name: "Quit", icon: "quit"}
            }
        });
    }

As you can see I am storing the value in a variable:

var localNode = this.Node;

and using this variable inside the callback function.
Peculiar thing about this is, the alert(localNode.Content); inside the callback gives correct value when the menu is clicked the very first time. After that even though the alert of the outer function gives different values correctly, the inner callback function keeps displaying the same old value as that of the first time.

Answer 1

Feeling quite stupid right now cause I was missing a very simple thing here.
I was able to resolve this issue by declaring variable outside the function as in by using a global variable.

Below is the change:

 var localNode;

 function OnContextMenu() {

 //alert(key + ' ' +this.Node.Content);
 localNode = this.Node;
 alert(localNode.Content); //CORRECT NODE VALUE GETS ALERTED

    $.contextMenu({
        selector: '.Container', 
        callback: function(key, options) {
            var m = "clicked: " + key;
             alert(localNode.Content); //ALWAYS PRINTS THE VALUE OF THE VERY FIRST NODE THAT WAS CLICKED. 
            // window.console && console.log(m) || alert(m); 
        },
        items: {
            "edit": {name: "Edit", icon: "edit"},
            "cut": {name: "Cut", icon: "cut"},
            "copy": {name: "Copy", icon: "copy"},
            "paste": {name: "Paste", icon: "paste"},
            "delete": {name: "Delete", icon: "delete"},
            "sep1": "---------",
            "quit": {name: "Quit", icon: "quit"}
        }
    });
}