Search code examples
sharepoint-list

Microsoft List - formatting every second row with a diffrent color

i would like to formatt my Microsoft List as follow:

I would like to color every second row gray and in addition, when a status is set to Completed, set the complete row to green.

Can someone help me with the JSON Code?

Thanks.

Greetings Phil

Solution

  • Use JSON like below for your SharePoint JSON view formatting settings:

    {
  "$schema": "https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json",
  "additionalRowClass": "=if([$Status]=='Completed','sp-field-severity--good',if(@rowIndex%2==0,'sp-css-backgroundColor-BgLightGray30','sp-css-backgroundColor-noFill'))"
}

    Where Status is the internal name of your SharePoint list column. You can get the internal name of your column by following this article: How to find the Internal name of columns in SharePoint Online?

    Output:

    enter image description here

    Steps to add JSON:

    1. Choose Format current view option from your list view like:

      enter image description here

    2. Switch to Advanced mode

    3. Add above JSON in text box and click Save button