I wanted to use a custom contextmenu on right click, I found over internet. When I integrated that with my code, it is showing TypeError: $.contextMenu is undefined. I am actually using the jquery.contextmenu.js file. I have also some other js files, 2 of them are my customized js, one is a jquery-ui (1.10.3), and last one is a jquery 1.9.1.

I am calling a function where on right click that context menu appears. I am not sure if this needs to be called inside a right click mouseevent listener or I just need to use the context menu function when I need a right click event. The detail of this context menu item is stated here: .php

I wanted to use a custom contextmenu on right click, I found over internet. When I integrated that with my code, it is showing TypeError: $.contextMenu is undefined. I am actually using the jquery.contextmenu.js file. I have also some other js files, 2 of them are my customized js, one is a jquery-ui (1.10.3), and last one is a jquery 1.9.1.

I am calling a function where on right click that context menu appears. I am not sure if this needs to be called inside a right click mouseevent listener or I just need to use the context menu function when I need a right click event. The detail of this context menu item is stated here: http://www.javascripttoolbox./lib/contextmenu/documentation.php

• javascript
• jquery

• 1 Is jquery.js loaded before the rest? – givemesnacks Commented Jun 18, 2013 at 18:10
• 5 " and last one is a jquery 1.9.1" should be the first one – A. Wolff Commented Jun 18, 2013 at 18:10
• Not that order exactly though. Is there any issue with the order? I am using jquery.contextmenu.js function inside jquery.stickynotes.js and yes, jquery.js is at the top and then jquery-ui.js, after those,stickynotes.js->pop.js(pop calls stickynotes.js) and lastly contextmenu.js – N. F. Commented Jun 18, 2013 at 18:14

2 Answers 2

To ensure that the contextMenu plugin works properly you need to insert the scripts in the following order:

1. jQuery
2. contextMenu plugin
3. Initialize contextMenu

Here's an example:

<!-- reference jQuery library and contextMenu plugin -->
<script src="//ajax.googleapis./ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="path/to/jquery.contextMenu.js" type="text/javascript"></script>

<!-- initialize contextMenu plugin -->
<script>
    $(function() {
        $(".context").contextMenu( [menu] , {options} );
    });
</script>

Also, be sure that the paths to your scripts are correct (one little typo can mess everything up; so double check if you keep running into issues).

The jquery library (1.9.1) should be loaded first, and as well you should be putting the code to attach event handlers to be run after the DOM is ready.

i.e.

$(document).ready(function() {
  // Attach my event handler here
});

or just

$(function() {
  // or use this shorthand
});

edit. Noticed the ments, they have the right idea as well.