Conditional formatting of SharePoint columns with Json

Occasional Contributor

Hi all, 

 

I am new to json and would sincerely appreciate some help and guidance. I am trying to set conditional formatting for a date column given 3 conditions: DateField >= @now + 7 daysDateField >= @now + 14 daysDateField >= @now + 21 days.

 

I have written the code based on Microsoft documentation on column formatting but it seems it does not with multiple conditions.. Could someone please help to understand the problem?

 

My code:

{
   "$schema":"https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
   "elmType":"div",
   "attributes":{
      "class":"=if(@currentField >= @now + 604800000,'#FF6347', if(@currentField >= @now + 1209600000, '#FFD700', if(@currentfield >= @now + 1814400000, '#32CD32', '')))"
   },
   "children":[
      {
         "elmType":"span",
         "style":{
            "display":"inline-block",
            "padding":"0 4px"
         },
         "attributes":{
            "iconName":"=if(@currentField >= @now + 1814400000,'Error', '')"
         }
      },
      {
         "elmType":"span",
         "txtContent":"@currentField"
      }
   ]
}
1 Reply

@mantas180, I can see that you have mistakenly applied these conditions to class instead of applying it to color property of style attribute.

Try below JSON code, it should work for you:

 

 

{
    "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
    "elmType": "div",
    "style": {
        "color": "=if(@currentField >= @now + 604800000,'#FF6347', if(@currentField >= @now + 1209600000, '#FFD700', if(@currentfield >= @now + 1814400000, '#32CD32', '')))"
    },
    "children": [{
            "elmType": "span",
            "style": {
                "display": "inline-block",
                "padding": "0 4px"
            },
            "attributes": {
                "iconName": "=if(@currentField >= @now + 1814400000,'Error', '')"
            }
        },
        {
            "elmType": "span",
            "txtContent": "@currentField"
        }
    ]
}

 


Please click Mark as Best Response if my post helped you solve your issue. This will help others find the correct solution easily. It also closes the item. If the content was useful in other ways, please consider giving it Like.