Forum Discussion
Json Tool - Looking for a miracle!
I am trying really hard to get my head round JSON for column formatting. Usually, I can look at code and work out how to adapt it (I am known as the copy and paste Queen!). JSON has got me, as I just do not understand it. I have used the lovely new column formatting tool, copied the JSON and now I want to extend it. I know there are lovely people on here who will help, but I am frustrated that I cannot work it out.
Does anyone know of any tools (I will pay for one) for absolute beginners? I have googled and got up to about the 10th page of results but they are all the same.
7 Replies
Hi Tanya Denton,
I use the Column Formatter web part. Here is the URL to a blog post on the solution: https://thechriskent.com/2017/12/21/column-formatting-client-side-web-part-column-formatter/
I hope this helps.
Norm
Tanya Denton What is it you're looking to know?
timparsons Hi, I suppose I am looking for a tool that will show me how JSON is structured in a really
easy way. For example, I have formatted this column using the out the box tool.
Gone to advanced and copied the JSON out as per the below. Now I want to expand on it i.e. only format if the Action Status = Open and also expand on the date calculations. Actually just pasting it into this message and copying it back out has made it a little easier to understand, however, I would not know how to add in an extra condition. This is why I have said I am looking for a miracle :-)
{
"elmType": "div",
"style": {
"padding": "0 4px"
},
"attributes": {
"class": {
"operator": ":",
"operands": [
{
"operator": "==",
"operands": [
"@currentField",
""
]
},
"",
{
"operator": ":",
"operands": [
{
"operator": "<",
"operands": [
{
"operator": "Date()",
"operands": [
{
"operator": "toDateString()",
"operands": [
"@currentField"
]
}
]
},
{
"operator": "Date()",
"operands": [
{
"operator": "toDateString()",
"operands": [
"@now"
]
}
]
}
]
},
"sp-css-backgroundColor-blockingBackground50",
{
"operator": ":",
"operands": [
{
"operator": "==",
"operands": [
{
"operator": "Date()",
"operands": [
{
"operator": "toDateString()",
"operands": [
"@currentField"
]
}
]
},
{
"operator": "Date()",
"operands": [
{
"operator": "toDateString()",
"operands": [
"@now"
]
}
]
}
]
},
"sp-css-backgroundColor-errorBackground50",
{
"operator": ":",
"operands": [
{
"operator": ">",
"operands": [
{
"operator": "Date()",
"operands": [
{
"operator": "toDateString()",
"operands": [
"@currentField"
]
}
]
},
{
"operator": "Date()",
"operands": [
{
"operator": "toDateString()",
"operands": [
"@now"
]
}
]
}
]
},
"sp-css-backgroundColor-successBackground50",
""
]
}
]
}
]
}
]
}
},
"txtContent": "@currentField"
}- Have a read of this page and then watch her video, she's good at explaining it. https://wonderlaura.com/2018/07/18/button-in-sharepoint-list-to-trigger-microsoft-flow/. Her youtube channel is very good.
Let me know if it doesn't help and I'll try and find more info for you.
