Forum Discussion
Yes/No Toggle that Delete's Item
I have a Yes/No column that I've formatted as a usable Toggle, but I'm wondering if it's possible to have the toggle delete the item row when toggled to Yes? Here is my current Column Formatting:
{ "_comment": "Toggle Buttons", "$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json", "elmType": "div", "style": { "position": "relative" }, "children": [ { "elmType": "div", "attributes": { "iconName": "ToggleFilled", "class": "=if(@currentField,'ms-fontColor-greenLight','ms-fontColor-gray40')" }, "style": { "font-size": "60px" } }, { "elmType": "div", "attributes": { "iconName": "=if(@currentField,'ToggleRight','ToggleLeft')", "class": "=if(@currentField,'ms-fontColor-green','ms-fontColor-gray120') + ' ms-fontColor-[PLACEHOLDER9]--hover','')" }, "style": { "cursor": "pointer", "font-size": "60px", "position": "absolute", "top": "0", "left": "0" }, "customRowAction": { "action": "setValue", "actionInput": { "Skyward": "=if(@currentField,0,1)" } } } ] }
AP_TC_ECASD In that case, you can use the simple JSON like:
{ "_comment": "Toggle Buttons", "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "attributes": { "iconName": "Delete", "class": "ms-fontColor-red" }, "style": { "cursor": "pointer", "font-size": "35px", "display": "=if(@currentField,'none','block')" }, "customRowAction": { "action": "delete" } }Also, delete confirmation popup will be shown by default - this is default functionality (or limitation) of SharePoint JSON formatting which we cannot customize.
If you need a delete button against each row without confirmation, you cannot do it using JSON formatting. You will have to use the SPFx field customizer for such requirements - code/development experience is required.
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.
AP_TC_ECASD Why don't you create a separate button/icon for deleting the list item (which will be shown only when column value is "No")?
Because I don't think you can add multiple actions in customRowAction in one element.
If you want to add delete button in same column JSON, you can use:
{ "_comment": "Toggle Buttons", "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "style": { "position": "relative" }, "children": [ { "elmType": "div", "attributes": { "iconName": "ToggleFilled", "class": "=if(@currentField,'ms-fontColor-greenLight','ms-fontColor-gray40')" }, "style": { "font-size": "60px" } }, { "elmType": "div", "attributes": { "iconName": "=if(@currentField,'ToggleRight','ToggleLeft')", "class": "=if(@currentField,'ms-fontColor-green','ms-fontColor-gray120') + ' ms-fontColor-[PLACEHOLDER9]--hover','')" }, "style": { "cursor": "pointer", "font-size": "60px", "position": "absolute", "top": "0", "left": "0" }, "customRowAction": { "action": "setValue", "actionInput": { "Skyward": "=if(@currentField,0,1)" } } }, { "elmType": "div", "attributes": { "iconName": "Delete", "class": "ms-fontColor-red" }, "style": { "cursor": "pointer", "margin-left": "15px", "font-size": "35px", "top": "0", "left": "0", "display": "=if(@currentField,'none','block')" }, "customRowAction": { "action": "delete" } } ] }Where Skyward is an internal name of your Yes/No column in SharePoint list. You can get the internal name of your SharePoint list columns by following this article: How to find the Internal name of columns in SharePoint Online?
Output:
If you don't want to have one additional button click to delete the item, you will have to do the deletion using Power automate flow on item modification - in that case, there may be some delay in view refresh after item is deleted.
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.
Hi ganeshsanap!
Ultimately, I'm not held to having the toggle at all. If there was just that delete button and it worked to delete the row, that would be the best scenario for the users who will be using it. I'm just looking for a way for the user to easily delete the row with a click of a button without having the confirmation and all that.
What are your thoughts?
AP_TC_ECASD In that case, you can use the simple JSON like:
{ "_comment": "Toggle Buttons", "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "attributes": { "iconName": "Delete", "class": "ms-fontColor-red" }, "style": { "cursor": "pointer", "font-size": "35px", "display": "=if(@currentField,'none','block')" }, "customRowAction": { "action": "delete" } }Also, delete confirmation popup will be shown by default - this is default functionality (or limitation) of SharePoint JSON formatting which we cannot customize.
If you need a delete button against each row without confirmation, you cannot do it using JSON formatting. You will have to use the SPFx field customizer for such requirements - code/development experience is required.
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.
