There are several special string values that can be used within both view and column formatting. The most common is, of course, @currentField which will return the value of the field you are formatting in column formatting or the title field in view formatting.
These “magic strings” are placeholders for contextual information that are replaced when the format is applied. For instance, @now will be replaced with the exact date/time the format is rendered. This is really helpful to provide dynamic formats.
While poking around today, I found a new one! @currentWeb can now be used to return the absolute url for the site! This is the equivalent of the page context’s webAbsoluteUrl.
Why is this exciting? Previously, you had 2 options when trying to link to something on your site or pulling in an image and they each had major drawbacks:
- Hardcode the Base URL (https://tenant.sharepoint.com/yourresource)
- Pro: You’ll always get the image/link you wanted
- Con: Your format can’t be reused on other sites without manually fixing these links
- Use a Relative URL (../../yourresource)
- Pro: Your format is reusable across sites
- Con: Your URLs are dependent on your relative location. So if someone uses your format within a web part on a different level of your site (folder), your URLs could break
Now, by using @currentWeb, you can have all the good with none of the bad!
For instance, just recently I demoed a quick tip on the PnP call that showed you how to use a relative URL to reference a local image in order to keep the format generic enough to be used with PnP Remote Provisioning. Now my dots can just be replaced with @currentWeb!
Here’s the original relative URL in the contenttype-format view formatting sample:
"elmType": "img",
"attributes": {
"src": "='../../Shared Documents/Fruit/' + if([$ContentType]=='Apple',[$AppleType],[$OrangeType]) + '.png'"
},
Again, that works fine as long as the format is being applied at the same relative distance from the image files. But now, we can just write:
"elmType": "img",
"attributes": {
"src": "=@currentWeb + '/Shared Documents/Fruit/' + if([$ContentType]=='Apple',[$AppleType],[$OrangeType]) + '.png'"
},
Now, the resulting URL will always resolve to my images regardless of where in the site my format is being rendered!
Here’s an even simpler example for when I want to link to a document in my documents library:
{
"$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
"elmType": "a",
"attributes": {
"href": "=@currentWeb + '/Shared Documents/MyDoc.pdf"
}
}
What a great addition! Now List Formatting is even more powerful!
Note: @currentWeb is only supported in SharePoint Online and is not available in SharePoint 2019
Update!
See this demoed on the PnP Call (Live from MVP Summit):
Love List Formatting?
Join the Bi-weekly (every other Thursday) SharePoint Patterns and Practices special interest group for general development call where I will be presenting a new List Formatting Quick Tip on each call!
Also, come get the full picture in my sessions about List Formatting at the SharePoint Conference in Las Vegas in May, or the European Collaboration Summit in Germany in May:
- Use KENT to save $50 for the SharePoint Conference
- Register for the European Collaboration Summit
The Chris Kent 