3

I'm trying to do some formatting of my document library. I'm specifically trying to format when I've grouped by a column, this column is a lookup column to another list.

This is the code I'm using.

{
    "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
    "groupProps": {
        "hideFooter":true,
      "headerFormatter": {
        "elmType": "div",
        "style": {
          "flex-wrap": "wrap",
          "background-color":"lightgray",
          "display": "flex",
          "box-sizing": "border-box",
          "padding": "4px 8px 5px 8px",
          "border-radius": "6px",
          "align-items": "center",
          "white-space": "nowrap",
          "overflow": "hidden",
          "margin": "1px 4px 4px 1px"
        },
        "attributes": {
          "class": "'sp-field-borderAllRegular sp-css-borderColor-neutralSecondary'"
        },
        "children": [
          {
            "elmType": "div",
            "children": [
              {
                "elmType": "div",
                "style": {
                  "display": "flex",
                  "flex-direction": "row",
                  "justify-content": "center"
                },
                "children": [
                  {
                    "elmType": "div",
                    "txtContent": "=  @group.count + ' Document(s)'",
                    "style": {
                      "padding": "5px 5px 5px 5px",
                      "font-weight": "500"
                    }
                  }
                ]
              }
            ]
          },
          {
            "elmType": "div",
            "children": [
              {
                "elmType": "div",
                "style": {
                  "display": "flex",
                  "flex-direction": "row",
                  "justify-content": "center"
                },
                "children": [
                  {
                    "elmType": "div",
                    "txtContent": "= 'Agent: ' + @group.fieldData.displayValue",
                    "style": {
                      "padding": " ",
                      "font-weight": "500"
                    }
                  }
                ]
              }
            ]
          }
        ]
      }
    }
  }

This is giving me an [object Object] result which is really confusing me, I can only assume this is due to it being a lookup column.

enter image description here

Any help would be greatly appreciated, many thanks.

1

1 Answer 1

5

Try using below JSON code:

{
    "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
    "groupProps": {
        "hideFooter": true,
        "headerFormatter": {
            "elmType": "div",
            "style": {
                "flex-wrap": "wrap",
                "background-color": "lightgray",
                "display": "flex",
                "box-sizing": "border-box",
                "padding": "4px 8px 5px 8px",
                "border-radius": "6px",
                "align-items": "center",
                "white-space": "nowrap",
                "overflow": "hidden",
                "margin": "1px 4px 4px 1px"
            },
            "attributes": {
                "class": "'sp-field-borderAllRegular sp-css-borderColor-neutralSecondary'"
            },
            "children": [
                {
                    "elmType": "div",
                    "children": [
                        {
                            "elmType": "div",
                            "style": {
                                "display": "flex",
                                "flex-direction": "row",
                                "justify-content": "center"
                            },
                            "children": [
                                {
                                    "elmType": "div",
                                    "txtContent": "=  @group.count + ' Document(s)'",
                                    "style": {
                                        "padding": "5px 5px 5px 5px",
                                        "font-weight": "500"
                                    }
                                }
                            ]
                        }
                    ]
                },
                {
                    "elmType": "div",
                    "children": [
                        {
                            "elmType": "div",
                            "style": {
                                "display": "flex",
                                "flex-direction": "row",
                                "justify-content": "center"
                            },
                            "children": [
                                {
                                    "elmType": "div",
                                    "txtContent": "= 'Agent: ' + @group.fieldData.lookupValue",
                                    "style": {
                                        "padding": " ",
                                        "font-weight": "500"
                                    }
                                }
                            ]
                        }
                    ]
                }
            ]
        }
    }
}

Use @group.fieldData.lookupValue instead of @group.fieldData.displayValue

Output:

enter image description here

Documentation: Use view formatting to customize SharePoint

6
  • where did you add the column name in your script?
    – Harris
    Dec 4, 2023 at 2:20
  • I am not showing column name in the JSON, only the column values? What are your requirements? Please Ask a new question. Dec 4, 2023 at 2:53
  • very similar to this post. I have a SharePoint online document library with a lookup column to another SharePoint online list. The allow multiple selections have been enabled in the lookup column in SPO document library. What I want is grouping the lookup column
    – Harris
    Dec 4, 2023 at 2:58
  • You can group based on lookup column from view settings page or from list view by clicking on column name/header. Let me know if it works for you or please Ask a new question where other users can also respond. Dec 4, 2023 at 5:26
  • The lookup column I am trying to make the group is unavailable on the view setting page because it allows multiple options to be turned on.
    – Harris
    Dec 4, 2023 at 6:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.