Full text of a choice option visible in form view

[ConnM]

Hello

I am editing forms for our business with a little bit of JSON formatting. One thing requested, if it would be possible to have the full text of the choice column visible to in the form view. Some of the choices are about 30 words long

I was able to make the full text visible in the list view with a piece of JSON, but I do not think this is possible in form view

If they need to they can always hover over and get the tool tip

Thanks

Conn

[#2]

@ConnM I think you have grouped the SharePoint list form fields using Configure layout - Apply formatting to "Body". Hence the forms fields have less width on the form because there are 2 fields in a row.

So, in that case, unfortunately it is not possible to show the full text for choice options using JSON formatting even when you add more "width" in the JSON. As you already know they can see the full text on hover of choice text.

---

Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.

[#3 · Accepted solution]

@ConnM I did some research from my end and seems it is possible by applying the JSON column formatting on choice columns.

Here's the JSON I used: 

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "style": {
    "flex-wrap": "wrap",
    "display": "flex"
  },
  "children": [
    {
      "elmType": "div",
      "style": {
        "box-sizing": "border-box",
        "padding": "4px 8px 5px 8px",
        "overflow": "hidden",
        "text-overflow": "ellipsis",
        "display": "flex",
        "max-width": "200px",
        "word-wrap": "break-word",
        "border-radius": "16px",
        "height": "44px",
        "align-items": "center",
        "white-space": "wrap",
        "margin": "4px 4px 4px 4px"
      },
      "attributes": {
        "class": {
          "operator": ":",
          "operands": [
            {
              "operator": "==",
              "operands": [
                "@currentField",
                "Lorem ipsum dolor sit amet consectetur adipiscing elit"
              ]
            },
            "sp-css-backgroundColor-BgCornflowerBlue sp-field-fontSizeSmall sp-css-color-CornflowerBlueFont",
            {
              "operator": ":",
              "operands": [
                {
                  "operator": "==",
                  "operands": [
                    "@currentField",
                    "Ut enim ad minim veniam quis nostrud exercitation"
                  ]
                },
                "sp-css-backgroundColor-BgMintGreen sp-field-fontSizeSmall sp-css-color-MintGreenFont",
                {
                  "operator": ":",
                  "operands": [
                    {
                      "operator": "==",
                      "operands": [
                        "@currentField",
                        "Duis aute irure dolor in reprehenderit voluptate"
                      ]
                    },
                    "sp-css-backgroundColor-BgGold sp-field-fontSizeSmall sp-css-color-GoldFont",
                    {
                      "operator": ":",
                      "operands": [
                        {
                          "operator": "==",
                          "operands": [
                            "@currentField",
                            ""
                          ]
                        },
                        "",
                        "sp-field-borderAllRegular sp-field-borderAllSolid sp-css-borderColor-neutralSecondary"
                      ]
                    }
                  ]
                }
              ]
            }
          ]
        }
      },
      "txtContent": "@currentField"
    }
  ]
}

Specifically, I added below inside style of inner div element: 

"max-width": "200px",
"word-wrap": "break-word",
"white-space": "wrap",

List view: 

List form: 

---

Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.

[#4]

Thanks @ganeshsanap

I did not realise column formatting would have any effect on the forms. I shall test this later today and report back. This looks extremely promising

[#5]

@ConnM Sure, let me know if you need any further help on this or if it is working fine for you.

---

Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.

[#6]

@ganeshsanap 

Thanks very much, all sorted