Has anybody got any hints/tips on handling likely code changes arising from JQuery upgrades? 1

[jrbarnett]

I am involved in upgrading a vendor application that includes moving from JQuery 1.6.1 to 1.10.2.
One particular section of our application uses a third party charting library FusionCharts 3.2.2 SR1 to display two graphs of high level summary information, and this page only uses JQuery 1.11.0, loaded via the JQuery CDN.

If I carry on with this page as is in the upgraded application, it works intermittently - sometimes the graphs get rendered, other times they don't. It coincides exactly with the version of JQuery used - console.log ($.fn.jquery) tells me this.

If I try and remove the 1.11.0 to use the new vastly upgraded native support, I can get the graphs to render properly consistently in Firefox, Chrome and IE 8. However if I try in IE 10 the graphs remain broken.

If I upgrade the graphs library to the latest version my employer is licensed for 3.3.1 SR3, which I realise is far from the newest release, I can get the graphs to work consistently well in Chrome, Firefox and IE8 but without the tooltips (that worked using the old version). IE10 support doesn't work.

The developer that wrote this has now moved on without leaving any documentation on this other than a terse comment that "the reason he loaded the JQuery 1.11.0 was to get around a compatibility issue" with no further information.

Does anybody have any useful hints and tips on debugging this, I am not really a Javascript/JQuery expert.

John

 

[jpadie]

umm, without being silly, why not continue to load jquery 1.11.0 for Fusioncharts? there is no reason why more than one version of jQuery cannot coexist on the same page (you cannot use $ for one though).

 

[jrbarnett]

Because if I do, some other functionality on that page (buttons that allow access to the rest of the application based on user access permissions) also only work intermittently.

John

 

[jpadie]

as i said - make sure that the two versions are logically separated. in compatibility mode. use the old version only for fusioncharts.

eg

<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script>
old_jQ=jQuery.noConflict(true);
</script>

then you access the new jQ with the $ sign or jQuery.() or whatever, and the old with old_jQ. of course you can use the $ inside your scripts still

(function($){
  $(document).ready( function(){
    alert ("I am running version: " + $.fn.jQuery )'
  });
))(old_jQ);

 

[jrbarnett]

Right, I got some more time today to follow up on this issue. The tooltips work in IE10 only if the x-ua-compatible meta tag is present in the web page as per

http://msdn.microsoft.com/en-us/library/windows/desktop/ff966528(v=vs.85).aspx

Its not a show stopper issue for the live upgrade although it does have a prominent place on the landing page from the portal in which it is launched.
I will be recommending that funds are found to upgrade to a current release rather than one several years old which will give other features as well. It then becomes the bosses problem rather than mine.
I am fairly sure it relates to order of code execution within the browser because of the intermittent nature of the problem.

Thank you all for your time,

John