Cody S
Cody S

Reputation: 4824

RequireJS JQuery ContextMenu issues

I'm working on an HTML5 page whose Javascript is powered by RequireJS. I've defined many dependencies using RequireJS, even ones that do not support AMD, with success (I mention this to illustrate that my RequireJS config is mostly functional). I have run into an issue with one particular dependency, however.

I'm trying to get Medialize's JQuery ContextMenu Plugin working. The relevant parts (or, at least, the parts I believe to be relevant) of my RequireJS config are:

require.config({
    paths: {
        'jquery': "jQuery/jquery-latest", //jQuery 1.10.2
        'jquery-ui': "jQuery/jquery-ui-1.10.3",
        'jquery-contextmenu': "jQuery/jquery.contextmenu.r2.packed",
        ...
    },
    shim: {
       "jquery-ui": ["jquery"],
       "jquery-contextmenu": ["jquery"],
       ...
    }
});

Then, in my code, I'm doing:

define(["jquery", "jquery-contextmenu"], function ($) {
    $(document).ready(function () {
        $.contextMenu({
            selector: 'a',
            items: {
                "edit": {name: "Edit"}
            }
        });
    });
});

So, the idea would be that any time an "a" tag got right-clicked, a context menu should pop out with one option, Edit.

Instead, Before I click anything, I get the error Uncaught TypeError: $.contextMenu is not a function which, to me, sounds like the contextMenu isn't being loaded correctly by/for RequireJS...but I'm not sure how to fix it.

Any assistance is appreciated

EDIT: Added a Plunker, but it's not working very well. I'm getting some timeouts and RequireJS script errors. Not sure why.

Upvotes: 1

Views: 2118

Answers (1)

Louis
Louis

Reputation: 151380

The errors you got in your Plunker were due to slapping ".js" at the end of your paths. Don't do this. (You did not do this in the code you show in the question but introduced this problem in your plunker.) You also did what this answer suggested, which was bad advice, because with the shim you are using for it jquery-contextmenu returns undefined for a module value. So assigning it to $ makes $ undefined.

Once I edit those issues out of your plunker (which I forked), the error in your question here does not happen.

Upvotes: 2

Related Questions