JSON Code - Course Registration

Martin, Heidi (SE GP T SP PS) 571 Reputation points
2024-02-01T08:19:11.94+00:00

Good morning,

I need help with a JSON-Code for registration. When the registration is full, can you set it so that you can no longer click on the plus button? Thank you!

User's image

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "style": {
    "flex-directon": "row",
    "justify-content": "left",
    "align-items": "center",
    "flex-wrap": "nowrap"
  },
  "children": [
    {
      "elmType": "div",
      "style": {
        "display": "=if(indexOf([$PeopleWhoRegistered.email], @me) == -1 && length([$PeopleWhoRegistered]) != [$NumberOfPlaces] && @now <= [$RegistrationEndDate], '','none')",
        "flex-directon": "row",
        "justify-content": "left",
        "align-items": "center",
        "flex-wrap": "wrap"
      },
      "children": [
        {
          "elmType": "button",
          "customRowAction": {
            "action": "setValue",
            "actionInput": {
              "PeopleWhoRegistered": "=appendTo([$PeopleWhoRegistered], @me)"
            }
          },
          "attributes": {
            "class": "ms-fontColor-themePrimary ms-fontColor-themeDarker--hover",
            "title": "Register"
          },
          "style": {
            "border": "none",
            "background-color": "transparent",
            "cursor": "pointer",
            "display": "flex",
            "flex-directon": "row",
            "justify-content": "left",
            "align-items": "center",
            "flex-wrap": "wrap"
          },
          "children": [
            {
              "elmType": "span",
              "attributes": {
                "iconName": "AddTo"
              },
              "style": {
                "padding": "0px"
              }
            }
          ]
        }
      ]
    },
    {
      "elmType": "div",
      "style": {
        "display": "=if(indexOf([$PeopleWhoRegistered.email], @me) > -1 && @now <= [$RegistrationEndDate], '','none')",
        "flex-directon": "row",
        "justify-content": "left",
        "align-items": "center",
        "flex-wrap": "wrap"
      },
      "children": [
        {
          "elmType": "button",
          "customRowAction": {
            "action": "setValue",
            "actionInput": {
              "PeopleWhoRegistered": "=removeFrom([$PeopleWhoRegistered], @me)"
            }
          },
          "attributes": {
            "class": "ms-fontColor-themePrimary ms-fontColor-themeDarker--hover",
            "title": "Unregister"
          },
          "style": {
            "border": "none",
            "background-color": "transparent",
            "cursor": "pointer",
            "display": "flex",
            "flex-directon": "row",
            "justify-content": "left",
            "align-items": "center",
            "flex-wrap": "wrap"
          },
          "children": [
            {
              "elmType": "span",
              "attributes": {
                "iconName": "Blocked12"
              },
              "style": {
                "padding": "0px"
              }
            }
          ]
        }
      ]
    },
    {
      "elmType": "div",
      "children": [
        {
          "elmType": "span",
          "txtContent": "Registered",
          "style": {
            "display": "=if([$RegistrationEndDate] > @now && indexOf([$PeopleWhoRegistered.email], @me) > -1, '','none')",
            "padding-left": "5px",
            "word-break": "keep-all"
          }
        }
      ]
    },
    {
      "elmType": "div",
      "children": [
        {
          "elmType": "span",
          "txtContent": "- Registration is full",
          "style": {
            "display": "=if([$RegistrationEndDate] > @now && length([$PeopleWhoRegistered]) >= [$NumberOfPlaces], '','none')",
            "padding-left": "5px",
            "word-break": "keep-all"
          }
        }
      ]
    },
    {
      "elmType": "div",
      "children": [
        {
          "elmType": "span",
          "txtContent": "Registration has ended",
          "style": {
            "display": "=if([$RegistrationEndDate] > @now, 'none','inherit')",
            "padding-left": "5px",
            "word-break": "keep-all"
          }
        }
      ]
    }
  ]
}
Microsoft 365 and Office | SharePoint | For business | Windows
{count} votes

Answer accepted by question author
  1. Emily Du-MSFT 51,941 Reputation points Microsoft External Staff
    2024-02-02T09:17:38.35+00:00

    Per my test, due to the action property is one of the few properties that does not support if expressions. So, it is not possible to make the plus button unclickable when the Registration is full.

    As a workaround, you could make the plus button invisible when the Registration is full. Here are codes.

    {
      "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
      "elmType": "div",
      "style": {
        "flex-directon": "row",
        "justify-content": "left",
        "align-items": "center",
        "flex-wrap": "nowrap"
      },
      "children": [
        {
          "elmType": "div",
          "style": {
            "display": "=if(indexOf([$PeopleWhoRegistered.email], @me) == -1 && length([$PeopleWhoRegistered]) < [$NumberOfPlaces] && @now <= [$RegistrationEndDate], '','none')",
            "flex-directon": "row",
            "justify-content": "left",
            "align-items": "center",
            "flex-wrap": "wrap"
          },
          "children": [
            {
              "elmType": "button",
              "customRowAction": {
                "action": "setValue",
                "actionInput": {
                  "PeopleWhoRegistered": "=appendTo([$PeopleWhoRegistered], @me)"
                }
              },
              "attributes": {
                "class": "ms-fontColor-themePrimary ms-fontColor-themeDarker--hover",
                "title": "Register"
              },
              "style": {
                "border": "none",
                "background-color": "transparent",
                "cursor": "pointer",
                "display": "flex",
                "flex-directon": "row",
                "justify-content": "left",
                "align-items": "center",
                "flex-wrap": "wrap"
              },
              "children": [
                {
                  "elmType": "span",
                  "attributes": {
                    "iconName": "AddTo"
                  },
                  "style": {
                    "padding": "0px"
                  }
                }
              ]
            }
          ]
        },
        {
          "elmType": "div",
          "style": {
            "display": "=if(indexOf([$PeopleWhoRegistered.email], @me) > -1 && @now <= [$RegistrationEndDate], '','none')",
            "flex-directon": "row",
            "justify-content": "left",
            "align-items": "center",
            "flex-wrap": "wrap"
          },
          "children": [
            {
              "elmType": "button",
              "customRowAction": {
                "action": "setValue",
                "actionInput": {
                  "PeopleWhoRegistered": "=removeFrom([$PeopleWhoRegistered], @me)"
                }
              },
              "attributes": {
                "class": "ms-fontColor-themePrimary ms-fontColor-themeDarker--hover",
                "title": "Unregister"
              },
              "style": {
                "border": "none",
                "background-color": "transparent",
                "cursor": "pointer",
                "display": "flex",
                "flex-directon": "row",
                "justify-content": "left",
                "align-items": "center",
                "flex-wrap": "wrap"
              },
              "children": [
                {
                  "elmType": "span",
                  "attributes": {
                    "iconName": "Blocked12"
                  },
                  "style": {
                    "padding": "0px"
                  }
                }
              ]
            }
          ]
        },
        {
          "elmType": "div",
          "children": [
            {
              "elmType": "span",
              "txtContent": "Registered",
              "style": {
                "display": "=if([$RegistrationEndDate] > @now && indexOf([$PeopleWhoRegistered.email], @me) > -1, '','none')",
                "padding-left": "5px",
                "word-break": "keep-all"
              }
            }
          ]
        },
        {
          "elmType": "div",
          "children": [
            {
              "elmType": "span",
              "txtContent": "- Registration is full",
              "style": {
                "display": "=if([$RegistrationEndDate] > @now && length([$PeopleWhoRegistered]) >= [$NumberOfPlaces], '','none')",
                "padding-left": "5px",
                "word-break": "keep-all"
              }
            }
          ]
        },
        {
          "elmType": "div",
          "children": [
            {
              "elmType": "span",
              "txtContent": "Registration has ended",
              "style": {
                "display": "=if([$RegistrationEndDate] > @now, 'none','inherit')",
                "padding-left": "5px",
                "word-break": "keep-all"
              }
            }
          ]
        }
      ]
    }
    

    Result:

    enter image description here


    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.

    1 person found this answer helpful.

1 additional answer

Sort by: Most helpful
  1. Martin, Heidi (SE GP T SP PS) 571 Reputation points
    2024-02-01T13:35:41.56+00:00

    No solutions?

    0 comments No comments

Your answer

Answers can be marked as 'Accepted' by the question author and 'Recommended' by moderators, which helps users know the answer solved the author's problem.