0

I'm a bit of a noob about JSON and I want to use it to my benefit. What I want to do based on the attachment is the following:

Sharepoint example

Latin Qual Required? column is set to Choice setting and Latin Qual Date column is set to Short Date setting

  • If Latin Qual Required? column has "Yes" and the Latin Qual Date is empty, change cell to background color with a specific hex code or the "error" class with Icon.
  • If Latin Qual Required? column has "Yes" and the Latin Qual Date is entered, change cell to background color with a specific hex code "success" class with Icon.
  • If Latin Qual Required? column has "Yes" and the Latin Qual Date is empty, change cell to red or the "error" class with Icon.
  • If Latin Qual Required? column has "No" a change cell to background color with a specific hex code
1
  • Which columns cell background you want to change? or you want to change the background color of whole row? Jan 24, 2020 at 4:33

1 Answer 1

0

The below JSON helps you to get the required output. Add the below snippet to the in Latin Qual Required? field column format. I assumed the internal name for Latin Qual Required? is Title and internal name for Latin Qual date is StartDate

    {
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "attributes": {
"class": "=if(Number([$StartDate]) == 0, 'sp-field-severity--blocked', if(@currentField == 'Yes','sp-field-severity--good','sp-field-severity--blocked')) + ' ms-fontColor-neutralSecondary'"

  },
  "children": [
    {
      "elmType": "span",
      "style": {
        "display": "inline-block",
        "padding": "0 4px"
      },
      "attributes": {
        "iconName": "=if(Number([$StartDate]) == 0, 'Warning', if(@currentField == 'Yes','CheckMark','Warning'))"
      }
    },
    {
      "elmType": "span",
      "txtContent": "@currentField"
    }
  ]
}

The output looks likes below,

enter image description hereg

I hope this helps to solve your query.

2
  • hi, i'm so sorry for the delay. is it possible to just use background colors via Hex vs the classes to have more options?
    – SLang
    Feb 14, 2020 at 20:40
  • @SLang yes! You can add a "background-color": "#F3F3F3" to the style properties. You can use the same expression from the class attribute and just replace the values with hex colors. Jul 6, 2020 at 15:54

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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