Unanswered

Change the color of a button when clicked

(0) Share

Report

Posted on by Jenine1_1

I have a workflow button in a sharepoint list. I would like to add to the workflow that when this button is clicked change color. can you please help me

Categories:

Building flows

I have the same question (0)

All responses (4)

Answers (1)

Expiscornovus 33,189 Most Valuable Professional on at

Like (1)

Report
Hi @Jenine1_1,

You could potentially use column formatting for that. You just need to track that click or use another column value from the list/library.

https://learn.microsoft.com/en-us/sharepoint/dev/declarative-customization/formatting-syntax-reference#excel-style-expressions

Below is an example with the Send Changes value.

{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "button", "customRowAction": { "action": "executeFlow", "actionParams": "{\"id\": \"yourflowguid\"}" }, "attributes": { "class": "=if([$SendChanges] == 'Email changes made', 'ms-fontColor-red ms-fontColor-themeDarker--hover', 'ms-fontColor-themePrimary ms-fontColor-themeDarker--hover')" }, "style": { "border": "none", "background-color": "transparent", "cursor": "pointer" }, "children": [ { "elmType": "span", "attributes": { "iconName": "Flow" }, "style": { "padding-right": "6px" } }, { "elmType": "span", "txtContent": "Send to Manager" } ] }

Was this reply helpful? Yes No
Jenine1_1 91 on at

Like (0)

Report

thank you so much for this, i did what you suggested, but it didnt change the color, this is what i have, can you please let me know what i did wrong, I am very new to Json

{
"$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
"elmType": "Button",
"txtContent": "Send for QA",
"customRowAction": {
"action": "executeFlow",
"actionParams": "{\"id\": \"xxxxxxxxxxxxxxxxxxxxxx\"}"
},
"attributes": {
"class": "=if([$SendChanges] == 'Email changes made', 'ms-fontColor-red ms-fontColor-themeDarker--hover', 'ms-fontColor-themePrimary ms-fontColor-themeDarker--hover')"
},
"style": {
"border": "none",
"cursor": "pointer",
"background-color": "transparent"
},
"children": [
{
"elmType": "span",
"attributes": {
"iconName": "Flow"
},
"style": {
"padding-right": "4px"
}
},
{
"elmType": "span",
"txtContent": "Send for QA"
}
]
}

Was this reply helpful? Yes No
Verified answer

Expiscornovus 33,189 Most Valuable Professional on at

Like (0)

Report

Hi @Jenine1_1,

In that if statement you need to use the internalname of the Send Changes column. I assumed that internal name of the field was SendChanges, but might be different in your setup. Can you double check?

You can check in the list/library settings. Also see method 1 in @ekarim2020 his nice blog about internal names:

https://elliskarim.com/2021/12/20/finding-the-internal-name-of-a-sharepoint-column/

The example I shared only shows a red colour when the 'Email changes made' text value is in the Send Changes column. A row with an empty value would not change colour after clicking. You would still have to update that Send Changes column with that text from within your flow.

Again it was just an example to demonstrate such an approach.

Was this reply helpful? Yes No
Jenine1_1 91 on at

Like (0)

Report

Thank you for that. I understand now. Much appreciated for your time and help.

Was this reply helpful? Yes No