SP.ClientContext is always "undefined" in JSLink functions

Question

I'm trying to execute CSOM functions as part of a JSLink extension to override rendering of a Lookup Field.

Problem is every time I try to access SP.ClientContext it returns as undefined

I have tried calling an executeOrDelayUntilScriptLoaded operation to load the context, but my JSLink "rendering" functions always execute WAY before this actually does anything.

SP.SOD.executeOrDelayUntilScriptLoaded(loadContext, 'sp.js');

function loadContext() {
    context = SP.ClientContext.get_current();
    web = context.get_web();
}

If I try putting my JSLink callback functions inside this then they never actually work (and I just get OOB rendering).

hatch.testRender = function (ctx) {
    alert(context); // always returns "undefined"
}

the function retrieves ctx, I think you should use alert(ctx) command. — Alexander, Aug 16 '13 at 12:16
No the context (ctx) object in a JSLink function is different to the ClientContext object — Martin Hatch, Aug 17 '13 at 20:53

score 12 · Accepted Answer · answered Jan 02 '14 at 17:51

SharePoint 2013 CSR OnPreRender handler could used for initialization of ClientContext since OnPreRender is called before the actual View/Fields rendering

Example:

(function () {   


    function OnPreRenderDocItemTemplate(renderCtx) {
        SP.SOD.executeOrDelayUntilScriptLoaded(loadContext, 'sp.js');
        function loadContext() {
            var context = SP.ClientContext.get_current();
            var web = context.get_web();
        }
    }


    function RegisterDocViewTemplate() {

        var viewContext = {};
        viewContext.Templates = {};
        viewContext.Templates.OnPreRender = OnPreRenderDocItemTemplate; 
        SPClientTemplates.TemplateManager.RegisterTemplateOverrides(viewContext);
    }
    ExecuteOrDelayUntilScriptLoaded(RegisterDocViewTemplate, 'clienttemplates.js');

})();

score 3 · Answer 2 · answered Sep 27 '13 at 12:30

3

I worked around this problem by having the custom render function return just a placeholder HTML element, and using a $(window).load handler to later populate the element with content obtained through JSOM calls.

By the time the handler executes, the necessary JavaScript libraries have already been loaded, and SP.ClientContext is also available.

answered Sep 27 '13 at 12:30

Jan Ruusuvuori

31
2

Yes, I suppose this would be the workaround. I ended up using REST calls instead using standard AJAX methods – Martin Hatch Sep 28 '13 at 18:23

score 2 · Answer 3 · answered Apr 23 '14 at 17:01

I experienced the same issue using JSLink in O365 Sharepoint Online. My solution was to call my function requiring SP.ClientContext as follows:

//Perform SP.ClientContext tasks after sp.js is loaded
window.onload = function() { SP.SOD.executeFunc('sp.js','SP.ClientContext', someFunction()); };

score 1 · Answer 4 · answered Sep 14 '16 at 17:09

Adding another answer to this question with yet another solution:

Instead of messing around with ExecuteOrDelayUntilScriptLoaded or SP.SOD.executeFunc, I simply added the JSOM files that I needed to get loaded into my JSLink.

So for instance, I needed to use the SP.WorkflowServices namespace. In order to use that, according to this MSDN page, the required files are:

SP.js
SP.Runtime.js
SP.WorkflowServices.js

And of course they have to be loaded in order. So my JSLink for the particular field I'm overriding looks like:

clienttemplates.js|sp.js|sp.runtime.js|sp.workflowservices.js|~site/path/to/my-csr-script.js

And whatever framework is handling loading the JSLink files respects the order, so the files get loaded correctly, and I can use SP.WorkflowServices in my CSR override code.

score 0 · Answer 5 · edited May 28 '15 at 14:56

0

The problem I have had with SP.ClientContext undefined was problem with the load library.

My solution did reference to MicrosoftAjax on cloud and not my solution.

I believe when you build a SharePoint solution, itself did it.

I solved changing the references. I downloaded library and add into the my solution, another words, there are not references out solution.

edited May 28 '15 at 14:56

Amal Hashim

28,306
5
31
61

answered May 28 '15 at 14:50

Rodrigo Imparato

1

score 0 · Answer 6 · edited Apr 13 '17 at 12:41

I ran into this problem also.

I suspected what was happening was that while the code is delaying for 'SP.js' to load, 'clientTemplates.js' is running full steam ahead and calls RenderListView() before the code can execute RegisterTemplateOverrides().

My answer to this was to leverage @Aveenav's answer to overriding the BaseViewId on Using Different BaseViewID values for multiple JSLink on a single page

(function(){
    //Delay the execution of RenderListView until sp.js is loaded
    ExecuteOrDelayUntilScriptLoaded(function() {
         //Take a copy of the existing Microsoft Definition of RenderListView
         var oldRenderListView = RenderListView;

         //Now delay the execution of the rest of RenderListView until sp.js is loaded
         RenderListView = function(ctx,webPartID) {
             ExecuteOrDelayUntilScriptLoaded(function() {
                 oldRenderListView(ctx,webPartID);
             }, 'sp.js');
         }
    }, 'ClientTemplates.js');
    // Continue with Template Overrides
})();

Testing this showed that I had access to SP.ClientContext within the onPostRender() function (which was where I needed it.)

score 0 · Answer 7 · answered Aug 16 '13 at 16:56

0

Try this:

SP.SOD.executeFunc('sp.js','SP.ClientContext',loadContext);

function loadContext() {
    context = SP.ClientContext.get_current();
    web = context.get_web();
}

answered Aug 16 '13 at 16:56

Vardhaman Deshpande

10,462
1
26
52

As I put in my original post something like that works but if I try to include it in my JSLink render functions then my custom rendering gets ignored by SharePoint. If I put it outside of the JSLink render functions then it doesn't execute in time (so is always undefined during rendering) – Martin Hatch Aug 17 '13 at 20:52

score 0 · Answer 8 · answered Sep 13 '13 at 09:17

0

I had a similar problem. It worked well when I moved all my SP.ClientContext code inside the onInit event. You need to register onInit event and call CSOM inside that event. This event executes once all controls are loaded ..

answered Sep 13 '13 at 09:17

Kunal Valecha

444
1
4
12

SP.ClientContext is always "undefined" in JSLink functions

8 Answers8

Linked