Question

I’m using two jquery plugins. Both extend jquery with a prototype function removeTag. This causes the second-loaded plugin to work correctly, while the first one does not.

As a quick patch, I renamed the removeTag – and all calls to it – on the second plugin to something else.

Obviously, thats not a good solution. Upgrades will need to be manually edited, and there could be other namespace collisions that I haven’t realized yet.

Can anyone recommend some effective strategies for dealing with this?

The two plugins I am using are:

• jQuery TagIt – http://aehlke.github.com/tag-it/
• jQuery TagsInput – https://github.com/xoxco/jQuery-Tags-Input

Answer 1

You can add a js file with the code from below:

if (jQuery) {
    jQuery.namespace = function(namespace) {
            var names = namespace.split(".");
            var parent = window;
            for (var index = 0; index < names.length; index++) {
                    if (!parent[names[index]]) {
                            parent[names[index]] = function() {
                                    throw "Namespace, Cannot instantiate";
                            }
                    }
                    parent = parent[names[index]];
            }
    }

}

And on your scripts you can use it like the following:

$.namespace("Somejs.MyCustomjs");

And later on the Code refer to the full Namespace like:

SomeJs.MyCustomjs.myFunc();

hope It helps

Edit: I forgot to mention that on the declaration of your js class you netted to use the full namespace