SharePoint 2010: var $ conflict between CMSSiteManager.js and jQuery
I ran into an issue recently on a SharePoint 2010 project where a page containing a Thumbnails list view was throwing a JavaScript error. I actually took the wrong path troubleshooting this and burned through a lot of time as a result. I had incorrectly assumed the error had something to do with our custom master page.
Turns out the CMSSiteManager.js library that is used by the Thumbnails list view is also using the $ variable! Argh!
Good thing the plug-in pattern we use only calls $ internally and not globally…
(function($) { // plug-in goodness here... })(jQuery);
Unfortunately our scripts for invoking the plug-ins was referencing $…
$(document).ready(function(){ $('.foo').samplePlugin(); });
A quick replacement of $ to jQuery did the trick:
jQuery(document).ready(function(){ jQuery('.foo').samplePlugin(); });
If you have large blocks of inline jQuery code on your page, you’ll probably want to use jQuery.noConflict():
jQuery.noConflict()(function() { // code using $ as alias to jQuery });
Categories: JavaScript, jQuery, SharePoint
2010, CMSSiteManager.js, conflict, error, JavaScript, jQuery, js, list, SharePoint, thumbnail, view
Thank you! You saved me so much time! Thought it had something to do with jquery js loading sequence.