Forum Discussion

ewoll500's avatar
ewoll500
Copper Contributor
Mar 27, 2023
Solved

Clickable sharepoint list icons from list view- how to make it happen?

hello,

 

I am editing an existing sharepoint list that had already one yes/no column that is shown via an icon and is clickable from the list view (not needing to click into the file). I added another yes/no column and formatted it identically (save from a different icon), and I can't figure out how to make it be able to toggle yes/no from my list view. Please assist.

  • ewoll500 Can you check if you are using correct internal name of your respective column inside actionInput in place of "vipCustomer"?

     

    Follow this to get the correct internal name of column: Find the internal name of SharePoint column 


    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.

    For SharePoint/Power Platform blogs, visit: Ganesh Sanap Blogs

6 Replies

  • ewoll500 Here's one example for reference: 

     

    {
      "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
      "elmType": "div",
      "style": {
        "display": "flex",
        "width": "100%",
        "height": "100%",
        "align-items": "center"
      },
      "children": [
        {
          "elmType": "div",
          "style": {
            "display": "flex",
            "width": "60px",
            "height": "30px",
            "border-radius": "15px",
            "align-items": "center",
            "flex-direction": "row",
            "justify-content": "=if(@currentField , 'flex-end' , 'flex-start')",
            "cursor": "pointer"
          },
          "customRowAction": {
            "action": "setValue",
            "actionInput": {
              "YesNoColumnInternalName": "=if(@currentField , '0' , '1' )"
            }
          },
          "attributes": {
            "class": "=if(@currentField , 'ms-bgColor-themePrimary' , 'ms-bgColor-neutralTertiaryAlt')"
          },
          "children": [
            {
              "elmType": "div",
              "style": {
                "width": "18px",
                "height": "18px",
                "margin-left": "6px",
                "margin-right": "6px",
                "border-radius": "50%"
              },
              "attributes": {
                "class": "ms-bgColor-white"
              }
            }
          ]
        }
      ]
    }

    Related ReadHow to find the Internal name of columns in SharePoint Online? 

     


    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.

    For SharePoint/Power Platform blogs, visit: Ganesh Sanap Blogs

    • ewoll500's avatar
      ewoll500
      Copper Contributor
      This is the current json:

      {
      "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
      "elmType": "div",
      "style": {
      "margin": "5px"
      },
      "children": [
      {
      "elmType": "div",
      "style": {
      "width": "40px",
      "height": "40px",
      "border-radius": "50%",
      "display": "flex",
      "justify-content": "center",
      "align-items": "center",
      "font-size": "20px",
      "cursor": "pointer"
      },
      "attributes": {
      "class": "=if(@currentField , 'ms-bgColor-blue ms-bgColor-themeDark--hover ms-fontColor-white' , 'ms-bgColor-neutralQuaternaryAlt ms-bgColor-neutralTertiaryAlt--hover ms-fontColor-neutralSecondary')",
      "iconName": "ReleaseDefinition"
      },
      "customRowAction": {
      "action": "setValue",
      "actionInput": {
      "vipCustomer": "=if(@currentField , '0' , '1' )"
      }
      }
      }
      ]
      }




      What's strange is it's copied exactly from another column that DOES allow for clicking from list view...... I just changed the icon.
      • ewoll500 I just tried using same JSON you provided with the correct internal name of my column where I am applying this JSON and it worked for me: 

         

        {
          "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
          "elmType": "div",
          "style": {
            "margin": "5px"
          },
          "children": [
            {
              "elmType": "div",
              "style": {
                "width": "40px",
                "height": "40px",
                "border-radius": "50%",
                "display": "flex",
                "justify-content": "center",
                "align-items": "center",
                "font-size": "20px",
                "cursor": "pointer"
              },
              "attributes": {
                "class": "=if(@currentField , 'ms-bgColor-blue ms-bgColor-themeDark--hover ms-fontColor-white' , 'ms-bgColor-neutralQuaternaryAlt ms-bgColor-neutralTertiaryAlt--hover ms-fontColor-neutralSecondary')",
                "iconName": "ReleaseDefinition"
              },
              "customRowAction": {
                "action": "setValue",
                "actionInput": {
                  "VIPCustomer": "=if(@currentField , '0' , '1' )"
                }
              }
            }
          ]
        }

         

        Output


        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.

        For SharePoint/Power Platform blogs, visit: Ganesh Sanap Blogs

  • ewoll500 Can you share the current JSON you are using for both the columns? 

     

    Ideally, you have to use the setValue customRowAction in JSON formatting to update list column. You have to use the correct internal name of columns in your JSON while updating. If you are updating same/current column, you can use @currentField.


    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.

    For SharePoint/Power Platform blogs, visit: Ganesh Sanap Blogs

Resources