pnp / List-Formatting

List Formatting Samples for use in SharePoint and Microsoft Lists
https://pnp.github.io/List-Formatting/
MIT License
1.7k stars 822 forks source link

Pop up confirmation? #706

Open sympmarc opened 10 months ago

sympmarc commented 10 months ago

Question (the more details, the better)

Is it possible to pop up a sort of "Are you sure?" dialog when a user clicks on a formatted column which uses setValue?

aaclage commented 10 months ago

Dear Mr. @sympmarc

Thank you for your question, This is a Yes/No answer, below my answer

1- Yes, It's possible to pop up a sort of "Are you sure?"

Thank you for your attention on this subject.

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "children": [
    {
      "elmType": "div",
      "style": {
        "border": "2px solid #c8c6c4",
        "padding": "10px",
        "border-radius": "5px",
        "cursor": "pointer"
      },
      "txtContent": "='Click me!!' + @currentField",
      "customCardProps": {
        "openOnEvent": "hover",
        "isBeakVisible": true,
        "formatter": {
          "elmType": "div",
          "style": {
            "padding": "10px 0 0 0"
          },
          "children": [
            {
              "elmType": "div",
              "style": {
                "cursor": "pointer",
                "display": "table"
              },
              "attributes": {
                "class": " ms-fontColor-themePrimary"
              },
              "children": [
                {
                  "elmType": "div",
                  "style": {
                    "text-align": "center",
                    "line-height": "normal",
                    "font-size": "24px",
                    "padding": "5px"
                  },
                  "txtContent": "Are you sure?"
                },
                {
                  "elmType": "div",
                  "float": "left",
                  "children": [
                    {
                      "elmType": "div",
                      "style": {
                        "text-align": "center",
                        "display": "inline-block",
                        "width": "100px",
                        "border-top": "2px solid #c8c6c4"
                      },
                      "attributes": {
                        "class": "ms-fontSize-14"
                      },
                      "txtContent": "Yes",
                      "customRowAction": {
                        "action": "setValue",
                        "actionInput": {
                          "Title": "Yes"
                        }
                      }
                    },
                    {
                      "elmType": "div",
                      "style": {
                        "text-align": "center",
                        "display": "inline-block",
                        "width": "100px",
                        "border-top": "2px solid #c8c6c4",
                        "border-left": "2px solid #c8c6c4"
                      },
                      "attributes": {
                        "class": "ms-fontSize-14"
                      },
                      "txtContent": "No",
                      "customRowAction": {
                        "action": "setValue",
                        "actionInput": {
                          "Title": "No"
                        }
                      }
                    }
                  ]
                }
              ]
            }
          ]
        }
      }
    }
  ]
}
sympmarc commented 10 months ago

Thank you, @aaclage! I figured if it was possible, there might be an existing sample, but I couldn't find one. I'll try it out and report back.