1 Reply Latest reply on Oct 26, 2012 8:37 PM by Asa B

    $CQ, $, JQuery, and JQPlot

    biosopher Level 1

      Can someone explain the use of $CQ versus $ in more detail for JQuery?  I already know that $CQ refers to CQ's built-in version of JQuery and that $ refera to any secondary jquery package that I may load.


      Let me be more precise.  My app requires charts and JQPlot seems one of the best plotting solutions available.  By default (as you would expect) jqplot.js file refers to JQuery through $.  My expectation would be that this would not work in CQ unless I renamed all the $ to $CQ in the jqplot.js file.  Oddly this wasn't true.  I simply added jqplot.js to my clientlib folder and was able to start rendering graphs.


      Very odd!  Why is that?


      The primary reason for asking is that while the JQuery base package is working, a JQPlot plugin (Cursor) is not...and I can only track it down to some issue between referring to $ versus $CQ.



        • 1. Re: $CQ, $, JQuery, and JQPlot
          Asa B Level 1

          CQ5 appears to use jQuery for some of the contributor / authour mode functionality. Wisely Adobe has name-spaced the version of jQuery they use for CQ5 in their $CQ alias.


          Open a javascript console in your browser and enter $CQ.fn.jquery --> "1.7"

          Next enter $.fn.jquery --> "1.X.X"


          You might need a specific version of jQuery for your jQplot plugin, and maybe you dont want to mess with upgrading CQ5's version of jQuery which is name-spaced in $CQ.


          Pretend jQplot depends on jQuery version "1.8.2", if you've addded a link to the newer version of jQuery on your page, the 1.8.2 version of jQuery will be aliased to "$" by default. This "$" is just for your convienience so you don't have to type jQuery("#foo").doSomthing(...); and can instead type $("#foo").doSomthing(...);


          You can therefore have both versions of jQuery running in the same page at the same time. Because jQuery 1.7 is referenced using $CQ and 1.8.2 is referenced via $


          Of course you could create your own namespace for jQuery


          var $JQ = jQuery.noConflict();


          More to the point, if you've loaded both versions of jQuery on the same page...


          var plot1 = $.jqplot ('chart1', [[3,7,9,1,4,6,8,2,5]]); <--- uses jQuery version "1.8.2"

          var plot2 = $CQ.jqplot ('chart1', [[3,7,9,1,4,6,8,2,5]]); <--- uses jQuery version "1.7"


          Its best not to load two versions jQuery unless there's some compeling reason to do so.


          Of course all this really depends on how you're loading jQuery. See jQuery's docs for more on working with jQuery with other libraries.