2013 CSR SPClientTemplates Add Delay

Question

I'm trying to add an override using SPClientTemplates but by the time my custom code calls RegisterTemplateOverrides it's too late, the CSR has already been processed. If I add my custom code to a Script Editor it works fine, but that's not what I want. I need it to be called after other things have been processed, essentially on demand or via callback.

I tried looking at clienttemplates.debug.js but I couldn't see a way to achieve what I need. Perhaps I'm just missing something?

Full disclosure I'm trying to make template modifications using angularjs directives, but again by the time angular has finished bootstrapping, the CSR is taking a nap.

Answer 1

I often use CSR to just set up placeholders in the right place on the page that I then access later through the custom IDs that I set. So my CSR scripts look a bit like:

var DEC = DEC || {};

DEC.myOverride = (function () {

  function setUpFields(ctx) {
    // set up placeholders with custom IDs
    html = '<div id="MyDiv_' + ctx.CurrentItem.ID + '"></div>';
    return html;
  }

  function doLaterProcessing() {
    // retrieve the elements based on the IDs i set up earlier
    // and do whatever else I need to with them here.
    // this could include starting off a chain of async calls that
    // eventually populates the elements with data 
  }

  return {
    render: function () {
      SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
        Templates: {
          Fields: {
            "MyField": {
              View: setUpFields,
            },
          },
        },
      });
    },
    postProcess: doLaterProcessing
  }
})();

RegisterModuleInit("/path/to/my/OverrideScript.js", DEC.myOverride.render);
DEC.myOverride.render();

// then trigger the later stuff later, either by:

$(window).load(function () {
  DEC.myOverride.postProcess();
});

// or:

_spBodyOnLoadFunctionNames.push('DEC.myOverride.postProcess');

Not sure if that will work for you, but that's the technique I use to "use CSR" while still doing a lot of stuff after the CSR rendering has finished.