SharePoint Document Issues

How to Format SharePoint List Rows with JSON Based on Due Dates

Maira Mehtab Sep 20, 2026 869 views

Question details

The user wants to format SharePoint List rows using JSON so that the row changes color dynamically (orange 30 days before, red after, and green when valid) based on an MEI Due date, and needs help resolving invalid JSON syntax errors.

Product: SharePoint Lists
Device & OS: not provided
Scenario: Tracking project or task deadlines visually in a SharePoint List by automatically highlighting rows based on their due date status.
Observed behavior: Users encounter invalid column-formatting JSON errors when attempting to apply conditional row colors based on dates, often due to schema or syntax mistakes.

Before you start

Ensure you have Edit or Owner permissions for the SharePoint List to modify view formatting, and have the exact internal name of your due date column ready.

Solution 1Recommended

Apply Conditional JSON Formatting for Dates

Use a verified JSON schema to apply background colors dynamically to the entire row based on the due date column.

To format the entire row rather than just a single column, you must apply the JSON code to the view formatting. The JSON uses mathematical expressions to calculate the difference between the current date and the due date.

Open view formatting

Open your SharePoint List, click on the view dropdown menu in the top right corner, and select 'Format current view'.

Access advanced mode

In the formatting pane on the right, click on 'Advanced mode' at the bottom to enter custom JSON code.

Paste and configure JSON

Paste your JSON code utilizing the standard SharePoint schema URL and conditional background-color expressions. Ensure your expressions reference the correct internal column name (e.g., [$MEIDueDate]).

Preview and save

Click 'Preview' to verify the colors (green for valid, orange for within 30 days, red for overdue). If everything looks correct, click 'Save'.

Syntax check: Make sure to check quotation marks, commas, and braces. An invalid schema or syntax will result in an error and prevent the formatting from rendering.

Solution 2

Troubleshoot Invalid JSON Errors

Fix common syntax and schema issues that cause the 'invalid column-formatting JSON' error in SharePoint.

Free Microsoft Office alternative

Manage Your Project Trackers Visually with WPS Office

While SharePoint offers complex JSON formatting for lists, you can easily track due dates and apply simple conditional formatting using WPS Spreadsheet without writing any code. WPS Office is a lightweight, free, and highly compatible alternative for your daily document and spreadsheet needs.

1. Open your tracker in WPS Spreadsheet: Launch WPS Spreadsheet and open the document where you manage your project deadlines.
2. Access Conditional Formatting: Select the due date column, navigate to the 'Home' tab, and click on 'Conditional Formatting'.
3. Set color rules: Choose 'Highlight Cells Rules' and use date-based or less-than/greater-than rules to easily set red, orange, and green colors for your deadlines.

Highly compatible with Microsoft Excel (.xlsx) formats and conditional formatting rules.Easy-to-use graphical interface for applying cell color rules based on dates without coding JSON.Free, lightweight suite including Writer, Spreadsheet, and Presentation.Seamless migration and familiar UI to boost productivity.

microsoft office alternative - wps office

Frequently Asked Questions

Why is my SharePoint JSON formatting returning a syntax error?

Syntax errors usually occur due to missing or extra commas, mismatched curly braces, or incorrect quotation marks in your JSON code. Using a free online JSON validator tool before pasting your code into SharePoint can help identify these issues.

How do I find the internal column name for my SharePoint JSON code?

Go to List Settings, click on the name of your column, and look at the URL in your web browser. The text following 'Field=' at the very end of the URL is the exact internal column name you must use in your JSON references.

Can I apply JSON formatting to an entire row instead of a single column?

Yes. To format an entire row, click the view dropdown menu, select 'Format current view', and ensure you select 'Entire Row' or 'Format view' rather than formatting a specific column. This allows the background color logic to apply across all columns.

Document & File Issues