SharePoint / sp-dev-docs

SharePoint & Viva Connections Developer Documentation
https://docs.microsoft.com/en-us/sharepoint/dev/
Creative Commons Attribution 4.0 International
1.24k stars 1k forks source link

List Formatting - Issue clicking in Board View using customCardProps "click" opens Edit item Form #9884

Open aaclage opened 3 weeks ago

aaclage commented 3 weeks ago

Target SharePoint environment

SharePoint Online

What SharePoint development model, framework, SDK or API is this about?

Declarative list formatting

Developer environment

Windows

What browser(s) / client(s) have you tested

Additional environment details

Describe the bug / error

Dear Mr. @shagra-ms, @tpodugu-ms, @arkogupta, I would like to report the following issue and inconsistent behavior Board View with declarative action customCardProps "Click":

When using the declarative customCardProps "Click" in Board View, the Edit Form appear with combination of customCardProps.

ErrorListFormattingClickBoard

Steps to reproduce

  1. Add Board View
  2. Add Title and description Column
  3. Include following View Formatting for Card and click on button to see behavior.
    {
    "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/board-formatting.schema.json",
    "hideSelection": false,
    "formatter": {
    "elmType": "div",
    "attributes": {
      "class": "sp-card-container sp-card-container-noPadding"
    },
    "children": [
      {
        "elmType": "button",
        "style": {
          "margin": "10px",
          "padding": "20px"
        },
        "txtContent": "Click here",
        "customCardProps": {
          "openOnEvent": "click",
          "formatter": {
            "elmType": "div",
            "style": {
              "padding": "20px"
            },
            "children": [
              {
                "elmType": "div",
                "style": {
                  "padding": "10px"
                },
                "children": [
                  {
                    "elmType": "div",
                    "style": {
                      "padding": "10px",
                      "font-size": "20px",
                      "border": "1px solid black",
                      "cursor": "pointer"
                    },
                    "attributes": {
                      "iconName": "WavingHand"
                    },
                    "txtContent": "Click me to open 2 dialog",
                    "customCardProps": {
                      "openOnEvent": "click",
                      "formatter": {
                        "elmType": "div",
                        "children": [
                          {
                            "elmType": "div",
                            "style": {
                              "padding": "10px",
                              "font-size": "20px",
                              "border": "1px solid black",
                              "cursor": "pointer"
                            },
                            "attributes": {
                              "iconName": "WavingHand"
                            },
                            "txtContent": "Click me again",
                            "customRowAction": {
                              "action": "setValue",
                              "actionInput": {
                                "Title": "=Number(@now)"
                              }
                            }
                          }
                        ]
                      }
                    }
                  },
                  {
                    "elmType": "div",
                    "style": {
                      "padding": "10px",
                      "font-size": "15px",
                      "font-weight": "bold"
                    },
                    "txtContent": "Title:"
                  },
                  {
                    "elmType": "div",
                    "style": {
                      "padding": "10px"
                    },
                    "txtContent": "[$Title]"
                  },
                  {
                    "elmType": "div",
                    "style": {
                      "padding": "10px",
                      "font-size": "15px",
                      "font-weight": "bold"
                    },
                    "txtContent": "Description:"
                  },
                  {
                    "elmType": "div",
                    "style": {
                      "padding": "10px"
                    },
                    "txtContent": "[$Description]",
                    "inlineEditField": "[$Description]"
                  }
                ]
              }
            ]
          }
        }
      }
    ]
    }
    }

Expected behavior

When using the declarative customCardProps "Click" in Board View, the Edit Form appear with combination of customCardProps.

aaclage commented 3 weeks ago

@tpodugu-ms, @arkogupta, for your consideration.

Fedes365 commented 3 weeks ago

@aaclage bug confirmed in my tenant too.