Sharepoint JSON formatting - show button A or B

Question

I want to show button A or button B in a column depending on value in another column.
one button should start a flow, another button should launch a hyperlink also I need to add other buttons.
I have spent the day googling and fudging and the current code shows nothing, if I remove the code for button B then button A works.
{
    "elmType": "div",
    "children": [
        {
            "elmType": "button",
            "txtContent": "New ",
            "customRowAction": {
                "action": "executeFlow",
                "actionParams": "{"id": "be40d280-88df9a875fa"}"
            },
            "style": {
                "display": "=if(  ([$Kent] == 'A' ), 'block', 'none')"
            }
        },
        {
            "elmType": "button",
            "txtContent": "New",
            "attributes": {
                "target": "_blank",
                "href": "='URL'"
            },
            "style": {
                "display": "=if(([$Kent] == 'B'), 'block', 'none')"
            },
        }
    ]
}

Michael Christensen · Answer

This works, while it creates either a button or a hyperlink, as buttons cant work as hyperlink. But the issue was the syntax of the "href" tag. All the googling i have done showed it to be written as  "href": "=' URL '" which must have thrown some error which made the entire column blank. When i changed it to "href": "http://www.google.dk"  it worked.
{
"elmType": "div",
"children": [
{
  "elmType": "button",
  "txtContent": "New ",
  "customRowAction": {
    "action": "executeFlow",
    "actionParams": "{"id": "XXXXXXXXXXXXXXXXXXXXXXX"}"
  },

"style":{
  "display": "=if(  ([$Kent] == 'A' ), 'block', 'none')"
}
},

{
  "elmType": "a",
  "txtContent": "New",
  "attributes": {
   "target": "_blank",
   "href": "https://www.google.dk"
},

"style":{
  "display": "=if(([$Kent] == 'B'), 'block', 'none')"
},
}
]
}

Ganesh Sanap · Answer

Try using below JSON code, it should work for you:
{
    "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
    "elmType": "div",
    "children": [
        {
            "elmType": "button",
            "txtContent": "New ",
            "customRowAction": {
                "action": "executeFlow",
                "actionParams": "{"id": "be40d280-88df9a875fa"}"
            },
            "style": {
                "display": "=if([$Kent] == 'A', 'block', 'none')"
            }
        },
        {
            "elmType": "a",
            "txtContent": "New",
            "attributes": {
                "target": "_blank",
                "href": "https://www.google.com"
            },
            "style": {
                "display": "=if([$Kent] == 'B', 'block', 'none')"
            }
        }
    ]
}

Sharepoint JSON formatting - show button A or B

2 Answers

Add your own answers!

Ask a Question