House 9: asp mvc jquery from cdn with fallback to localhost

Tuesday, March 15, 2011

asp mvc jquery from cdn with fallback to localhost

Paul Irish has some nice code for loading jquery from cdn but then falling back to localhost if it cannot be loaded from cdn. Check it out here.

For asp mvc you usually also want jquery.valdiater and possibly unobtrusive validation as well. Here is an html helper to generate html mark up that handles loading these via cdn with fallback

The helper

/// render script tag to include javascript file from cdn, but fallback to local if cannot be loaded
///
///
///
///
public static MvcHtmlString JavascriptIncludeFromCdnWithFallback(this HtmlHelper helper, string cdnPath, string localPath, string javascriptCondition)
{
var urlHelper = new UrlHelper(helper.ViewContext.RequestContext);
var cdnBuilder = new TagBuilder("script");
var localBuilder = new TagBuilder("script");

// src for cdn resource
cdnBuilder.Attributes.Add("src", cdnPath);
// js to build a local script tag if needed
localBuilder.InnerHtml = String.Format
(
"{0} && document.write(unescape('%3Cscript src=\"{1}\"%3E%3C/script%3E'))",
javascriptCondition,
urlHelper.Content(localPath)
);
// return markup
var built = String.Format("{0}\n\t{1}", cdnBuilder.ToString(TagRenderMode.Normal), localBuilder.ToString(TagRenderMode.Normal));
return MvcHtmlString.Create(built);
}
}

Usage, most likely from your layout file

And the rendered html

!window.jQuery && document.write(unescape('%3Cscript src="/Scripts/lib/jquery/jquery-1.4.4.min.js"%3E%3C/script%3E'))!window.jQuery.validator && document.write(unescape('%3Cscript src="/Scripts/lib/jquery/jquery.validate.min.js"%3E%3C/script%3E'))!window.jQuery.validator.unobtrusive && document.write(unescape('%3Cscript src="/Scripts/lib/jquery/jquery.validate.unobtrusive.min.js"%3E%3C/script%3E'))

House 9

Tuesday, March 15, 2011

asp mvc jquery from cdn with fallback to localhost

No comments:

Blog Archive

Subscriptions

Quote of the Day