MOSS 2010: Run JavaScript OnSharePointReady

I was working a MOSS 2010 and a Business Connectivity Services (BCS) external list.  One of the columns was meant to be a link rather than just displayed as a string.

So, I wanted to write a script to modify the Urls and change them to links via JQuery that I could add to the page via a Content Editor Web Part.

The tricky part is that SharePoint dynamically loads the BCS external list, so you have to wait until SharePoint is done loading the list and generates the list on the page before making modifications to the DOM.

After some searching, I found a link which referenced using the REST model.

http://zimmergren.net/technical/sharepoint-2013-business-connectivity-services-talking-to-your-external-lists-using-rest

http://msdn.microsoft.com/en-us/library/fp142380(v=office.15).aspx



To add a function to run when the DOM is fully loaded:

_spBodyOnLoadFunctionNames.push("YourOnLoadFunctionName");
 

Then in the function, you run the following to tell the code to run another function after the sp.js code is loaded.

function YourOnLoadFunctionName()
{
      SP.SOD.executeFunc('sp.js', 'SP.ClientContext',  YourOnSharePointReadyFunctionName);
}


function YourOnSharePointReadyFunctionName()
{
    //Your code to do when SharePoint is done doing everything for the page.      

}

 

An example of something you could run to alter the column data to your liking would be:

//Sample
<script language="javascript" type="text/javascript" src="[ref to JQuery library]"></script>
<script language="javascript">

//Changes a string containing a base url to a link
function YourOnSharePointReadyFunctionName()
{
$(".ms-vb2:contains('[SOME BASE URL]').each(
   function ()
    {
      var txtUrl=$(this).html();
      $(this).html("<a href=\"" + txtUrl + "\" target=\"_blank\">View Link</a>");

    }
}

);
</script>

---

2015 June 10, I was trying working with calendars and needed to update the colors of calendar items after the calendar items loaded.

https://mhusseini.wordpress.com/2012/05/18/handle-clicks-on-calendar-items-in-sharepoint-2010-with-javascript/ The above link worked for me. He basically uses the ExecuteOrDelayUntilScriptLoaded to launch his calendar hook code after the SP.UI.ApplicationPages.Calendar.js loads. Then, in the calendar hook he attaches his own function to the: SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed function. _spBodyOnLoadFunctionNames.push("LaunchColorCodeCalendarScriptOnReady"); function LaunchColorCodeCalendarScriptOnReady() { ExecuteOrDelayUntilScriptLoaded( MyCalendarHook, "SP.UI.ApplicationPages.Calendar.js"); } function MyCalendarHook() { var _patchCalendar = function () { //Do something to the items in the calendar here //ColorCodeCalendar(); }; var _onItemsSucceed = SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed; SP.UI.ApplicationPages.CalendarStateHandler.prototype.onItemsSucceed = function ($p0, $p1) { _onItemsSucceed.call(this, $p0, $p1); _patchCalendar(); }; }

12 Nov 2015:
 I was adding javascript to a calendar form to change the default hour setting for a calendar event in SharePoint. For some reason, some other onload function kept changing my EndDate Hour field after my function changed the Hour Field to what I wanted it to be.

function AfterSharePointOnLoadFunctionsBeginRunning() {
    // SP.SOD.executeFunc('sp.js', 'SP.ClientContext', OnSharePointReadyFunction);
    
    //This ensures that OnSharePointReady is the last function to run since by the time it starts running AfterSharePointSPLoaded, the _spBodyOnLoadFunctionNames should be populated.

     //This pushes OnSharePointReadyFunction to the end of the queue
    _spBodyOnLoadFunctionNames.push("OnSharePointReadyFunction");  
}


function OnSharePointReadyFunction() {
    //Your code to do when SharePoint is done doing everything for the page.
    AddEventHandlersToForm();

}
_spBodyOnLoadFunctionNames.push("AfterSharePointOnLoadFunctionsBeginRunning");