0

I've added a list view webpart onto a SharePoint 2013 online page, this webpart has a JS Link to a file containing JavaScript which applies different CSS to the CurrentRiskImpactLikelihood column depending on it's value.

The JavaScript i've used is below:

    (function () {
var condFieldCtx = {};
condFieldCtx.Templates = {};


condFieldCtx.Templates.Fields = {
"CurrentRiskImpactLikelihood": {"View": PriorityFormat1},
};
condFieldCtx.OnPostRender = [PriorityFormat1];
SPClientTemplates.TemplateManager.RegisterTemplateOverrides(condFieldCtx);
})();


function PriorityFormat1(ctx){

    var priorityValue = ctx.CurrentItem.CurrentRiskImpactLikelihood;

    if(priorityValue == 'Very Low'){
        return "<span><font style='padding:5px;color:black;background-color:yellow;display:block;'>"+ctx.CurrentItem.CurrentRiskImpactLikelihood+"</font></span>";
        }
    else if(priorityValue == 'Low'){
        return "<span><font style='padding:5px;color:black;background-color:yellow;display:block;'>"+ctx.CurrentItem.CurrentRiskImpactLikelihood+"</font></span>";
        }
    else if(priorityValue == 'Medium'){
        return "<span><font style='padding:5px;color:white;background-color:orange;display:block;'>"+ctx.CurrentItem.CurrentRiskImpactLikelihood+"</font></span>";
        }
    else if(priorityValue == 'High'){
        return "<span><font style='padding:5px;color:white;background-color:red;display:block;'>"+ctx.CurrentItem.CurrentRiskImpactLikelihood+"</font></span>";
        }
    else if(priorityValue == 'Very High'){
        return "<span><font style='padding:5px;color:white;background-color:red;display:block;'>"+ctx.CurrentItem.CurrentRiskImpactLikelihood+"</font></span>";
        }
    else{
        return ctx.CurrentItem.CurrentRiskImpactLikelihood;
        }
}

This works fine on page 1 of the values I return, it doesn't matter what the item limit of the pages in the view are, as soon as I go to the next page I get the following error:

TypeError: Cannot read property 'CurrentRiskImpactLikelihood' of null

Does anyone have any ideas on a fix for this? I've tried googling it but had no luck so far!

  • 2
    Can I ask why you are attaching your custom formatting function to both the field and OnPostRender? It seems to me that when it gets called on post-render, it would throw that error because ctx.CurrentItem would not exist in the post-render phase. – Dylan Cristy Feb 22 at 15:26
  • I've just commented out OnPostRender and it's solved the issue, thanks for your help! – OllieSP Feb 22 at 15:38
2

At first glance it would seem to me that the problem is occurring because you have attached your custom rendering function to both the field itself during view rendering, and as a function to be called OnPostRender.

The problem is that, during the post-render phase, ctx.CurrentItem will not exist, because at that point it is done rendering all of the individual items.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.