Column Formatting
17 TopicsConditional Formatting on whole column with variable reference cells
Hi, I'd like to format the colour fill of multiple cells within one particular column, when it's value is less than a cell in the row above of the next column. how should I do this please? eg. when the value of D93 is smaller than the value of E92 format fill red. Apply to all D's. So far I have established that if I type =($D$93<$E$92) then I can make the rule work for cell D93. But how can I replicate this formula throughout the whole of the D column, without typing for each individual cell. Is this even possible? Is there a short cut to copying the rules over? Thankyou 🙂236KViews0likes22CommentsJSON Clickable Action and sp-field-quickActions
Hi, I'm trying to format a quickfield action to open a task view link. Everything works as intended but I can't format the icon; the most it does is change to red when using the sp-field-trending--down class but if I use the sp-field-quickActions, it simply ignores it and displays as a regular ugly blue/purple hyperlink. I want to use a red or blue color (no ugly underline and make it a little bit bigger), any help would be greatly appreciated. Here's the code: { "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "debugMode": true, "elmType": "div", "children": [ { "elmType": "span", "style": { "padding-right": "8px" }, "txtContent": "[$ID]" }, { "elmType": "a", "attributes": { "iconName": "=if([$Tasks_x0020_List] > 0,'TaskLogo', '')", "class": "sp-field-quickActions", "target": "_blank", "href": { "operator": "+", "operands": [ "https://-----.sharepoint.com/eQMS/Lists/Customer%20Complaints%20Tasks/AllItems.aspx#InplviewHash2000000e63d8bd3fdec=FilterField1%3DComplaint%255Fx0020%255FID-FilterValue1%3D", "[$ID]" ] } } } ] } Here's the result:Solved11KViews0likes4CommentsSharePoint 2019, column formatting not working
Environment: SharePoint 2019. I am trying with column formatting. It is working fine with Online. Same code is not working in SP2019. May be office fabric is not loading as expected in SP2019. Is there any option to make it enable ? When i see in console, it is giving following errors:Solved11KViews0likes7CommentsColor Shading in the Cell based on Column Percentage Value in a List
Hi all, I've searched through the postings and cannot find what I'm trying to accomplish. (see attachment - I worked up a sample) I would like a color code in the column field to change based on the percentage complete. 0-25% = Red 26-50% = Orange 51-99% = Yellow 100% = Green Notes: There are 3 columns that calculate the percentage. Total subtracting Done = Remaining. EX: Total items = 9, 6 are Done with 3 remaining = 67% complete. Any ideas on how to make this happen? Many thanks in advance. SharePoint 365Solved9.1KViews0likes1CommentCalculate a duration in column formatting
How can I calculate a duration in column formatting? With calculated columns, I can calculate a duration in days by subtracting two dates. For example if Start is 9/2/2018 and End is 1/31/2019, End-Start returns 151. With column formatting, End-Start returns 5/31/1970. I understand that I could use both the calculated column and column formatting, but I'd rather do it in one shot. My formatting involves multiple calculations.Solved8.4KViews0likes1CommentSharePoint list (not site) image carousel
I'm looking for a way to create an image carousel in a list. Currently I have a list that displays an image using: { "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "img", "style": { "position": "relative", "width": "200 px" }, "attributes": { "src": "@currentField" } } What I'd like to do is add links to other images in other columns have have the carousel rotate through the value of the other columns. I found something like this, but can't quite figure out if there's a way to add this type of formatting into the column: { "timeline": { "tracks": [ { "clips": [ { "asset": { "type": "image", "src": "https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/images/happy1.jpg" }, "start": 0, "length": 2, "effect": "slideLeft", "transition": { "out": "carouselLeft" } }, { "asset": { "type": "image", "src": "https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/images/happy2.jpg" }, "start": 1.4, "length": 2.6, "effect": "slideLeft", "transition": { "in": "carouselLeft", "out": "carouselLeft" } }, { "asset": { "type": "image", "src": "https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/images/happy3.jpg" }, "start": 3.4, "length": 2.6, "effect": "slideLeft", "transition": { "in": "carouselLeft", "out": "carouselLeft" } }, { "asset": { "type": "image", "src": "https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/images/happy4.jpg" }, "start": 5.4, "length": 2.6, "effect": "slideLeft", "transition": { "in": "carouselLeft", "out": "carouselLeft" } }, { "asset": { "type": "image", "src": "https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/images/happy5.jpg" }, "start": 7.4, "length": 2.6, "effect": "slideLeft", "transition": { "in": "carouselLeft", "out": "carouselLeft" } }, { "asset": { "type": "image", "src": "https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/images/happy6.jpg" }, "start": 9.4, "length": 2.6, "effect": "slideLeft", "transition": { "in": "carouselLeft" } } ] } ], "soundtrack": { "src": "https://feeds.soundcloud.com/stream/802202977-unminus-deadfros5h.mp3" } }, "output": { "format": "mp4", "resolution": "sd" } } If there is not a way to use this format, is there a way that I could create a clickable action that rotates through those other columns instead of a fancy carousel? I'm a total noob when it comes to programming but if you give me an example, I can work with that just fine. Thanks.Solved6KViews0likes6CommentsDate field in JSON text column formatting child component shows empty.
Hi all, In a list I'm trying to show 3 additional column values in a text column: it's own (text) value, the item ID and a date. For this I'm using the following JSON: { "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "style": { "display": "block" }, "children": [ { "elmType": "div", "txtContent": "=if([$MigrationTemplate] == 'Main','Site ID:: ', 'Main site:: ') + @currentField", "style": { "display": "block" } }, { "elmType": "div", "txtContent": "='ID: ' + [$ID]" }, { "elmType": "div", "txtContent": "Migration on :" }, { "elmType": "div", "txtContent": "=if([$MigrationDate] == '', '', toDateString([$MigrationDate]))" } ] } @currentField and [$ID] show just fine, but the date field always shows up empty (even if I put it straight without the if). When I add the date at the top most component, it does show the date: { "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "txtContent": "= @currentField + toDateString([$MigrationDate])" } Again, the current column is a Single line of text column with a short site name in it. How can I show a date field in a child component as per first code sample??? UPDATE: Using the 2nd code snippet, I was able to accomplish the same using '\n' to add new lines: { "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "txtContent": "= if([$SiteTemplate] == 'Main','Main ID: ', 'Main site:: ') + @currentField + '\nID: ' + [$ID] + '\n' + if([$MigrationDate], 'Migration scheduled for: ' + toDateString([$MigrationDate]), '')" } In a test private view it worked like a charm, but in the public view I get a "Invalid date" error. So next to my original question for which I'm still curious whether or not there's a solution, I now need to resolve the Invalid date issue... Any ideas?Solved4.5KViews0likes6CommentsSharePoint List Web Part - Column Formatting Links
This post is meant to address why the column formatting for "target": "_blank" doesn't work in the SharePoint list web part. I have a SharePoint lists which has the Title column formatted to open a link. The JSON is set to open the link in a new tab. This functionality works when viewing the list itself, but when I put it on a page using a List Web Part, the link opens in the same tab. The real problem is when the link doesn't open in a new tab, after SharePoint navigates, the quick launch isn't updating to the subsite's navigation. I've seen posts on this specific issue before as well. The partial page loading/caching must be causing this. The two issues are somewhat unrelated. { "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "a", "txtContent": "@currentField", "attributes": { "target": "_blank", "href": "='[MySiteUrl]/sites/ops/[mySubSiteName]' + [$ID] + '/SitePages/Home.aspx'" } }4.2KViews0likes1CommentDate of release of Column formatting in SP Online Modern experience
Hello, Have received a mail about a new feature : Column Formatting on modern experience Lists. But I see nothing in my First Release Tenant. Did I look at the good place ? If I'm good, do you have a date for this feature ? I saw that custom forms with PowerApps was delayed, perhaps the same ? ThanksSolved3.7KViews1like14CommentsRemoval of special characters in a cell in Modern SharePoint Library
Hi Everyone, So I have a document library where the customer wanted to manually create indented subtasks. To do this, they added 5 dashes to specific items to create the appearance of indention. They want these dashes removed, while maintaining an indention. This is what it looks like: The Title column is just a single-line text column. I want the bottom three entries (that have the dashes) to appear indented under the top entry. But I obviously don't want the dashes. I don't know if this is a JSON issue, or may a power automate workflow to get rid of the dashes. Can I change the font of the dashes to white? I'm just not sure. Any help would be greatly appreciated. Thanks! Chris3.7KViews0likes2Comments