timgittos

Updated on May 28, 2009, due to partial fix. The fix should now be a complete fix.
–
Apologies for the somewhat confusing title.
I’ve been doing a lot of jQuery work, replacing all the AJAX.NET crap in my project at work to speed the interface up. I’ve started using the awesome jQuery Context Menu plugin. However, I found it was also messing around with jsTree which I am using on the same page.

The problem is that the jQuery Context menu overzealously unbinds all click events from the document. This means that it’s going to break all your other Javascript that relies on clicking. Checking the documentation for jQuery’s unbind function, you can see that it accepts a function as a second parameter. This is the function that will be unbound if you pass that in as a parameter.
So, I fixed the jQuery Context Menu by changing the following:

1. In the main contextMenu function, near the end, just above the return statement, I added the following:

   // External click event for document
   function onDocumentClick(e) {
         var menu = $('#' + o.menu);
         $(document).unbind('click', onDocumentClick).unbind('keypress');
         $(menu).fadeOut(o.outSpeed);
         return false;
   }
   

2. Next, I change the function that assigns the click listener to the document to assign the defined function, instead of an anonymous function. So, change:

   // Hide bindings
   setTimeout( function() { // Delay for Mozilla
         $(document).click( function() {
               $(document).unbind('click').unbind('keypress');
               $(menu).fadeOut(o.outSpeed);
               return false;
         });
   }, 0);
   

   to

   // Hide bindings
   setTimeout(function() { // Delay for Mozilla
         $(document).click(onDocumentClick);
   }, 0);
   

3. Lastly, I remove all instances of:

   $(document).unbind('click');
   

That’s it. That fixed the problem for me. You’ll notice I don’t bother with the keypress bindings. That’s because I’m not using them, so I’m not bothered. I’m assuming the fix for that will be a similar strategy, for those who are bothered.

I’ve uploaded my version for those who can’t get it working using the tips in this post, but remember the copyright remains with Cory S.N. LaViska over at A Beautiful Site.
jquery.contextMenu.js

Tags: bugfix, contextmenu, jquery

This entry was posted on Thursday, April 9th, 2009 at 3:36 pm and is filed under Javascript, Programming, Web Development. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.