I came across a bit of an obscure problem earlier today while doing some content creation on my current project. The solution is a SharePoint 2010 intranet with minor customisation – mainly some branding and some custom XSL for aggregations. Nothing complex. It also has some JQuery that does some manipulation of the quick launch (or left navigation) to automatically place links to Pages beneath a Pages heading since they appear as top level headings in the navigation by default. This isn’t a perfect solution but it does the job for this project…or it seemed to until this afternoon.
I was running through various areas of the site creating some dummy content when I noticed that the JQuery wouldn’t fire when I was browsing an Images library in a site. I noticed there was a javascript error telling me that an object was required on the first line of my JQuery. The same code worked perfectly on every other page of the site (including other libraries/lists) so I didn’t think my JQuery was at fault. After a bit of messing around trying to figure out what was going on I started going through a process of elimination trying to locate what was causing the issue and eventually determined that it was only occuring on the Thumbnails view of the Images library. If I changed the view to the standard All Items view, the JQuery would work as expected. Odd!
I decided to take a copy of the source HTML that was being generated on both the All Items and Thumbnails views and compare them using Windiff to try and identify what was different (other than presentation obviously) between the two views. I eventually narrowed it down to the following Javascript which is loaded in the Thumbnails view:
<script type=”text/javascript”>
var g_Rev = <xsl:value-of select=”concat($squote,ddwrt:GetCurrentBuildVersion(),$squote)”/>;
var g_AllowSilverlightPrompt = <xsl:value-of select=”ddwrt:AllowSilverlightPrompt()”/>;
<![CDATA[
var g_APD_ScriptsLoaded = 0;
var g_APD_CsssLoaded = 0;
function APD_CallbackWssView(who)
{
if("function" == typeof(window.status)) window.status('Boot Strap Callback from ' + who);
}
function SmtAddWindowLoadEvent(handlerFunc)
{
if (window.attachEvent)
{
window.attachEvent("onload", handlerFunc);
}
else if (window.addEventListener)
{
window.addEventListener("load", handlerFunc, false);
}
}
function APD_EnsureLoadHandlers()
{
EnsureScript("CMSSiteManager.js", typeof(AssetPickerPageCache), APD_LoadHandlers);
}
function APD_LoadHandlers()
{
g_AssetPickerPageCache = new AssetPickerPageCache();
g_AssetPickerXslContext = new AssetPickerXslContext();
EnsureScript("AssetPickers.js", typeof(AP_IsEmpty), APD_InitializeAssetPickerElements);
}
function APD_SimpleCacheControl()
{
return g_Rev;
}
function APD_AddStyleSheet(hrefValue)
{
if (!document.getElementsByTagName
|| !(document.createElement || document.createElementNS)) return;
var head = document.getElementsByTagName("head")[0];
var link = document.createElement(“link”);
link.setAttribute(‘type’, ‘text/css’);
link.setAttribute(‘rel’, ‘stylesheet’);
link.setAttribute(‘media’, ‘screen’);
var rev = APD_SimpleCacheControl();
var url = hrefValue + “?rev=”+rev;
link.setAttribute(‘href’, url);
head.appendChild(link);
return false;
}
function APD_AddScript(hrefValue)
{
if (!document.getElementsByTagName
|| !(document.createElement || document.createElementNS)) return;
var loc = document.getElementsByTagName(“head”)[0];
var rev = APD_SimpleCacheControl();
var link = document.createElement(“script”);
link.setAttribute(‘type’, ‘text/javascript’);
var url = hrefValue + “?rev=”+rev;
link.setAttribute(‘src’, url);
loc.appendChild(link);
link.onload = function ()
{
g_APD_ScriptsLoaded++;
if(“function” == typeof(window.status)) window.status(“Script #” + g_APD_ScriptsLoaded + ” loaded”);
}
return false;
}
]]>
if(document.g_APD_isFFScriptLoaded == undefined)
{
APD_AddStyleSheet(<xsl:value-of select=”concat($squote,$StylePath,’/portal.css’,$squote)”/>);
APD_AddScript(<xsl:value-of select=”concat($squote,$LocScriptPath,’/CMSSiteManager.js’,$squote)”/>);
APD_AddScript(<xsl:value-of select=”concat($squote,$LocScriptPath,’/AssetPickers.js’,$squote)”/>);
APD_AddScript(<xsl:value-of select=”concat($squote,$NonLocScriptPath,’/MediaPlayer.js’,$squote)”/>);
SmtAddWindowLoadEvent(APD_EnsureLoadHandlers);
document.g_APD_isFFScriptLoaded = true;
}
</script>
This script is found in %HIVE%\TEMPLATE\LAYOUTS\AssetPicker.xsl and I have absolutely no idea what it does but wanted to confirm if this was the cause of my problems so commented the block of code out (yes, I edited the hive directly – bad bad – but was only doing this for troubleshooting purposes and obviously took a backup copy of the file first!) to see what would happen. Success! The JQuery fired again.
Now this code obviously does something useful so just commenting it out isn’t a great option. I wanted to narrow down further what exactly was causing the issue so did some very amateurish troubleshooting and started adding functions back in one by one until the JQuery started to fail again. This revealed that the guilty line was:
APD_AddScript(<xsl:value-of select=”concat($squote,$LocScriptPath,’/CMSSiteManager.js’,$squote)”/>);
Opening CMSSiteManager.js revealed that it contained over 3000 lines of what may as well have been hieroglyphics given my basic understanding of Javascript which meant I was a bit stuck. Before making a desperate cry for help, I thought the issue through some more and wondered if the problem was that this script was being called AFTER I’ve included the JQuery code in the heading of the master page. I moved the import of both the JQuery library and my custom javascript file to the end of the master page (just before the closing body tag) and low and behold, everything started working!
So…I have no idea which of those 3000+ lines in CMSSiteManager.js caused the issue but it seems like if you want to use JQuery on any pages that reference that file (no, I don’t know how many other files do!) then you need to ensure you import JQuery and any dependent scripts after that reference…or at the end of the page to be safe.
If anyone can provide any more information on this or narrow down more specifically what the cause is than please let me know in the comments!
