SharePoint Button Triggering Action When Disabled

Question

SharePoint Button Triggering Action When Disabled

Yakout RAMZI 40

I'm working with SharePoint JSON column formatting to create a custom button labeled "Envoyer Validation". The button is designed to have three color states: green (valid and complete data), yellow (incomplete data), and grey (already validated). However, the issue is that the button triggers a SharePoint update message status even when it is in the yellow or grey states, which should not happen. The intention is for the button to be clickable only when it is green (indicating valid data), and inactive for yellow or grey states, without triggering any action or message. How can the customRowAction be fully blocked in SharePoint when the button is not supposed to be active? Here is the JSON code being used:

{ 
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "button",
  "txtContent": "Envoyer Validation",
  "style": { 
    "background-color": "=if([$Statut] == 'Validé', '#d6d6d6', if([$NomMedicament] && [$DateExpiration] && [$CodeProduit] && [$Fournisseur] && [$MedecinResponsable] && [$Posologie] && [$RemiseTotale] && ([$MotifPrescription] || [$TypeTraitement] == 'Traitement Prolongé' || [$TypeTraitement] == 'Traitement Ponctuel'), '#28a745', '#ffc107'))",
    "color": "white",
    "font-weight": "bold",
    "border-radius": "6px",
    "padding": "6px 12px",
    "cursor": "=if([$Statut] == 'Validé', 'not-allowed', if([$NomMedicament] && [$DateExpiration] && [$CodeProduit] && [$Fournisseur] && [$MedecinResponsable] && [$Posologie] && [$RemiseTotale] && ([$MotifPrescription] || [$TypeTraitement] == 'Traitement Prolongé' || [$TypeTraitement] == 'Traitement Ponctuel'), 'pointer', 'not-allowed'))",
    "pointer-events": "=if([$Statut] == 'Validé', 'none', if([$NomMedicament] && [$DateExpiration] && [$CodeProduit] && [$Fournisseur] && [$MedecinResponsable] && [$Posologie] && [$RemiseTotale] && ([$MotifPrescription] || [$TypeTraitement] == 'Traitement Prolongé' || [$TypeTraitement] == 'Traitement Ponctuel'), 'auto', 'none'))" 
  },
  "customRowAction": { 
    "action": "setValue",
    "actionInput": { 
      "Statut": "=if([$Statut] != 'Validé' && [$NomMedicament] && [$DateExpiration] && [$CodeProduit] && [$Fournisseur] && [$MedecinResponsable] && [$Posologie] && [$RemiseTotale] && ([$MotifPrescription] || [$TypeTraitement] == 'Traitement Prolongé' || [$TypeTraitement] == 'Traitement Ponctuel'), 'En Cours', [$Statut])" 
    } 
  } 
}

Accepted answer

0 additional answers

Your answer

Answer 1

Hi Yakout RAMZI

Thank you for posting your question in the Microsoft Q&A forum

In SharePoint, the double-click behavior on a list row is a built-in feature that automatically opens the item’s edit form. This behavior is "by design" and cannot be disabled or customized using JSON formatting or HTML-based methods.

This limitation exists because SharePoint’s JSON formatting is strictly declarative, it allows for styling and configuring UI elements, but does not support scripting or event handling (such as JavaScript). As a result, native browser or SharePoint events like double-clicks cannot be intercepted or overridden.

For more details, refer to the following official Microsoft resources:

To address this, we’ve implemented logic that ensures the following:

The action button only becomes active when all required fields are completed and the item’s status is not already set to "Validé".
If these conditions are not met, the button is displayed in yellow and is fully disabled for single-click interactions.
We use pointer-events: none and customRowAction: "none" to effectively block any unintended actions or updates.

Below is the JSON formatting applied to the view to control the button behavior:

{ 

  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", 

  "elmType": "div", 

  "attributes": { 

    "role": "button" 

  }, 

  "style": { 

    "background-color": "=if([$Statut] == 'Validé', '#d6d6d6', if([$NomMedicament] && [$DateExpiration] && [$CodeProduit] && [$Fournisseur] && [$MedecinResponsable] && [$Posologie] && [$RemiseTotale] && ([$MotifPrescription] || [$TypeTraitement] == 'Traitement Prolongé' || [$TypeTraitement] == 'Traitement Ponctuel'), '#28a745', '#ffc107'))", 

    "color": "white", 

    "font-weight": "bold", 

    "border-radius": "6px", 

    "padding": "6px 12px", 

    "cursor": "=if([$Statut] == 'Validé', 'not-allowed', if([$NomMedicament] && [$DateExpiration] && [$CodeProduit] && [$Fournisseur] && [$MedecinResponsable] && [$Posologie] && [$RemiseTotale] && ([$MotifPrescription] || [$TypeTraitement] == 'Traitement Prolongé' || [$TypeTraitement] == 'Traitement Ponctuel'), 'pointer', 'not-allowed'))", 

    "pointer-events": "=if([$Statut] == 'Validé', 'none', if([$NomMedicament] && [$DateExpiration] && [$CodeProduit] && [$Fournisseur] && [$MedecinResponsable] && [$Posologie] && [$RemiseTotale] && ([$MotifPrescription] || [$TypeTraitement] == 'Traitement Prolongé' || [$TypeTraitement] == 'Traitement Ponctuel'), 'auto', 'none'))" 

  }, 

  "txtContent": "Envoyer Validation", 

  "customRowAction": { 

    "action": "=if([$Statut] != 'Validé' && [$NomMedicament] && [$DateExpiration] && [$CodeProduit] && [$Fournisseur] && [$MedecinResponsable] && [$Posologie] && [$RemiseTotale] && ([$MotifPrescription] || [$TypeTraitement] == 'Traitement Prolongé' || [$TypeTraitement] == 'Traitement Ponctuel'), 'setValue', 'none')", 

    "actionInput": { 

      "Statut": "=if([$Statut] != 'Validé' && [$NomMedicament] && [$DateExpiration] && [$CodeProduit] && [$Fournisseur] && [$MedecinResponsable] && [$Posologie] && [$RemiseTotale] && ([$MotifPrescription] || [$TypeTraitement] == 'Traitement Prolongé' || [$TypeTraitement] == 'Traitement Ponctuel'), 'En Cours', [$Statut])" 

    } 

  } 

}

We hope the details provided will assist you effectively.

If the answer is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Yakout RAMZI 40 Reputation points

2025-06-13T07:36:25.9+00:00

Thank you for your response Gabriel-N .The issue with this JSON formatting is that while the yellow and grey buttons are correctly non-clickable, the green button is also unresponsive. My objective is to ensure that only the green button is clickable when all required conditions are met, and the other buttons remain inactive as expected .
Deleted

This comment has been deleted due to a violation of our Code of Conduct. The comment was manually reported or identified through automated detection before action was taken. Please refer to our Code of Conduct for more information.
Gabriel-N 1,715 Reputation points Microsoft External Staff Moderator

2025-06-16T10:11:45.2166667+00:00

Hi @Yakout RAMZI

I hope you're doing well and sorry for the late reply. I’ve been testing the column settings, and everything seems to be working smoothly with the following setup:

NomMedicament: Single line of text

DateExpiration: Date

CodeProduit: Single line of text

Fournisseur: Single line of text

MedecinResponsable: Single line of text

Posologie: Single line of text

RemiseTotale: Number

MotifPrescription: Single line of text

TypeTraitement: Choice

Statut: Single line of text (leave it empty)

Just wanted to check, could you share your current column settings as well? Also, it’s been a little while since we last touched base. Do you still need any help from my side?

Looking forward to hearing from you!
Yakout RAMZI 40 Reputation points

2025-06-16T10:15:51.0833333+00:00

Hello,

Thank you Gabriel-N for your response and for testing the JSON code in your environment.

I'd like to clarify a few key points regarding the configuration of my SharePoint list, which may explain why the expected behavior is not fully achieved on my side:

Current column configuration in my SharePoint list:

Field Current column type

NomMedicament Single line of text

DateExpiration Date and time

CodeProduit Single line of text

Fournisseur Single line of text

MedecinResponsable Single line of text

Posologie Multiple lines of text

RemiseTotale Text (not Currency)

MotifPrescription Single line of text

TypeTraitement Text (not Choice)

Statut Choice (Non Traité / En Cours / Validé)

Expected business behavior:

I would like the "Envoyer Validation" button to:

Be clickable only when all required fields are filled (green),

Automatically update the Statut column from "Non Traité" to "En Cours" up on click,

Remain inactive and unclickable if the data is incomplete (yellow),

Be fully disabled when the status is already "Validé" (grey).

Issue encountered:

Even when the button appears green (with all required conditions visually met), clicking it does not update the Statut field.
Gabriel-N 1,715 Reputation points Microsoft External Staff Moderator

2025-06-17T10:12:31.1133333+00:00

Thank you for your response @Yakout RAMZI

I am currently conducting tests related to this issue. Kindly allow me some time to complete the evaluation.

Share via

SharePoint Button Triggering Action When Disabled

0 additional answers

Your answer