Search code examples
javascriptsharepoint-onlinesharepoint-jsom

SharePoint list CSR default rendering fallback


I was searching on the internet found a couple of good examples but mostly related to rendering the default render method for forms.

My case is that I have a page with the same list in two webparts with different views, for one I want to apply the CSR for the other I just want to have the default rendering. some people mentioned that you can check the view id and call RenderFieldValueDefault(ctx) but that does not seemed to work, the output is none.

Here is how I tried:

 SP.SOD.executeFunc('clienttemplates.js', 'SPClientTemplates', function () {
  SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
    Templates: {
      Fields: {
        AnyFieldInternalName: {
          View: function (ctx) {
            if (ctx.listName !== 'some_unique_id') {
              return RenderFieldValueDefault(ctx);
            }
            return 'haha';
          },
        },
      },
    },
    OnPreRender: __customPreRender,
    OnPostRender: __customPostRender,
  });
});

Does anyone know how to achieve this without having to custom handle the "default fields"?

Thanks,


Solution

  • For whoever wondering, I was able to do it with the following code from the clienttemplates.debug.js

    /**
     * default render method taken from clienttemplates.debug.js
     * @param {Object} root the global root, in this case this is bound to window.
     * @param {Object} anCtx current context of the list
     * @param {Object} aField current field
     * @param {Object} anItem current item
     * @param {Object} aListSchema current list schema
     */
    var DefaultRenderFallBack = (function (root, anCtx, aField, anItem, aListSchema) {
      var fieldRenderMap = {
        Computed: new root.ComputedFieldRenderer(aField.Name),
        Attachments: new root.AttachmentFieldRenderer(aField.Name),
        User: new root.UserFieldRenderer(aField.Name),
        UserMulti: new root.UserFieldRenderer(aField.Name),
        URL: new root.UrlFieldRenderer(aField.Name),
        Note: new root.NoteFieldRenderer(aField.Name),
        Recurrence: new root.RecurrenceFieldRenderer(aField.Name),
        CrossProjectLink: new root.ProjectLinkFieldRenderer(aField.Name),
        AllDayEvent: new root.AllDayEventFieldRenderer(aField.Name),
        Number: new root.NumberFieldRenderer(aField.Name),
        BusinessData: new root.BusinessDataFieldRenderer(aField.Name),
        Currency: new root.NumberFieldRenderer(aField.Name),
        DateTime: new root.DateTimeFieldRenderer(aField.Name),
        Text: new root.TextFieldRenderer(aField.Name),
        Lookup: new root.LookupFieldRenderer(aField.Name),
        LookupMulti: new root.LookupFieldRenderer(aField.Name),
        WorkflowStatus: new root.RawFieldRenderer(aField.Name),
      };
    
      if (!(root.OffSwitch == null || root.OffSwitch.IsActive('39A8E192-9EFC-4922-9FD8-343D685E163C'))) {
        fieldRenderMap.Location = new root.LocationFieldRenderer(aField.Name);
      }
      // eslint-disable-next-line eqeqeq
      if (aField.XSLRender == '1') {
        /* eslint-disable no-param-reassign */
        aField.FieldRenderer = new root.RawFieldRenderer(aField.Name);
      } else {
        aField.FieldRenderer = fieldRenderMap[aField.FieldType];
        if (aField.FieldRenderer == null) { aField.FieldRenderer = fieldRenderMap[aField.Type]; }
      }
      if (aField.FieldRenderer == null) { aField.FieldRenderer = new root.FieldRenderer(aField.Name); }
      /* eslint-enable no-param-reassign */
    
      return aField.FieldRenderer.RenderField(anCtx, aField, anItem, aListSchema);
    }.bind(null, window));
    

    So with that I can do something like

     SP.SOD.executeFunc('clienttemplates.js', 'SPClientTemplates', function () {
      SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
        Templates: {
          Fields: {
            AnyFieldInternalName: {
              View: function (ctx, field, item, schema) {
                if (ctx.listName !== 'some_unique_id') {
                  return DefaultRenderFallBack (ctx, field, item, schema);
                }
                return 'haha';
              },
            },
          },
        },
        OnPreRender: __customPreRender,
        OnPostRender: __customPostRender,
      });
    });