Fallback for jQuery UI from google CDN

Question

Html5 Boilerplate uses the following trick for fallback to locally stored JQuery if grabbing it from Google CDN fails:

<script>!window.jQuery && document.write(unescape('%3Cscript src="js/libs/jquery-1.4.2.js"%3E%3C/script%3E'))</script>

How would you implement this trick to perform the same trick for jQuery UI?

score 28 · Accepted Answer · edited May 23 '17 at 12:04

28

<script type="text/javascript">!window.jQuery.ui && document.write(unescape('%3Cscript src="path to jquery UI lib'))</script>

Do this after the fallback for jQuery itself.

Or (if you don't like the !)

<script type="text/javascript">(window.jQuery.ui === /* notice the === */ undefined) && document.write( /* ... */)</script>

Detecting an undefined object property

edited May 23 '17 at 12:04

Community

1
1

answered Feb 16 '11 at 08:25

Anemoia

7,928
7
46
71

So this should work the same way for any plugin. Great stuff! – Yorgos Pagles Feb 16 '11 at 11:13
It should. If you don't like the ! you can also test if window.jQuery.ui is undefined. – Anemoia Feb 17 '11 at 08:12

score 6 · Answer 2 · edited Jun 01 '15 at 18:35

I do it like this:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/static/js/jquery.min.js"><\/script>')</script>


<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script>window.jQuery.ui || document.write('<script src="/static/js/jquery-ui.min.js"><\/script>')</script>

score 1 · Answer 3 · answered Apr 01 '15 at 22:06

Using the ASP.NET Web Optimization Framework

Easier way to do it when you're using bundles.

Get the Microsoft.AspNet.Web.Optimization package from NuGet. Now in your BundleConfig you can setup your bundles to include not only the CdnPath, but also a CdnFallbackExpression:

public static void RegisterBundles(BundleCollection bundles)
{
    bundles.UseCdn = true;
    BundleTable.EnableOptimizations = true;     
    var jquery = new ScriptBundle("~/bundles/jquery", "//ajax.aspnetcdn.com/ajax/jquery/jquery-2.0.0.min.js").Include(
            "~/Scripts/jquery-{version}.js");
    jquery.CdnFallbackExpression = "window.jQuery";
    bundles.Add(jquery);
    //...
}

Fallback for jQuery UI from google CDN

3 Answers3

Linked