JSON View formatting in SharePoint Online can be a useful tool for customizing the way list/library data is presented to end users. This can help improve the user experience and make it easier for users to understand and interact with the SharePoint list/library data.

In this blog post, we will discuss how to apply JSON View formatting in SharePoint Online using SharePoint REST API.

If you want to reuse the JSON view formatting from existing SharePoint list view to newly created views in same SharePoint online list or in different SharePoint list with similar columns, you can get the custom JSON formatting applied on existing SharePoint list view using SharePoint REST API. You have to use the REST endpoint in below format to fetch the JSON:

https://contoso.sharepoint.com/sites/SPConnect/_api/web/lists/getbytitle('My List')/views/getbytitle('All Items')?$select=Title,CustomFormatter

Once you get the list view formatting JSON using above API call, you can use it in below example to apply JSON View formatting to newly created SharePoint Online lists. For this blog post, we will reuse the JSON view formatting from one of my blog posts – SharePoint Online: Highlight selected list item rows using JSON formatting

You can use below SharePoint REST API code for applying JSON view formatting to SharePoint online list:

/sites/SPConnect/SiteAssets/jquery.min.js
<script type="text/javascript">
    function updateViewJSONFormatting(listName, viewName) {
        var viewEndpoint = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('" + listName + "')/views/getbytitle('" + viewName + "')";

        var jsonFormatting = {
			"$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
			"additionalRowClass": "=if(@isSelected, 'ms-bgColor-themePrimary ms-fontColor-white', '')"
		};
        
        var viewProperties = {
            "__metadata": {
                "type": "SP.View"
            },
            "CustomFormatter": JSON.stringify(jsonFormatting)
        };

        $.ajax({
            url: viewEndpoint,
            type: "POST",
            headers: {
                "accept": "application/json;odata=verbose",
                "content-type": "application/json;odata=verbose",
                "X-RequestDigest": $("#__REQUESTDIGEST").val(),
                "X-HTTP-Method": "MERGE",
                "If-Match": "*"
            },
            data: JSON.stringify(viewProperties),
            success: function(data) {
                console.log(data);
            },
            error: function(error) {
                console.log(error);
            }
        });
    }
</script>

You can call above reusable function like:

updateViewJSONFormatting('Comments List', 'All Items')

Once above function executes successfully, navigate to your SharePoint online list view and you will see that JSON view formatting is applied to your SharePoint online list view:

Learn more

• SharePoint Online: Download document library files using JSON Formatting
• Download Image from SharePoint Image column using JSON formatting
• SharePoint JSON formatting: Check if date & time column is blank/empty
• SharePoint: Replace All Occurrences of Substring in a String using JSON Formatting
• How to find the Internal name of columns in SharePoint Online?