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

[ewoll500]

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.

[#2]

@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

[#3]

@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 Read: How 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

[#4]

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.

[#5 · Accepted solution]

@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]

@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

[#7]

Yes! Thank you!