# How to disable non-array input field based on array input data

**URL:** <https://jsonforms.discourse.group/t/how-to-disable-non-array-input-field-based-on-array-input-data/2322>\
**Category:** General\
**Created:** [September 4, 2024, 7:13am UTC](https://jsonforms.discourse.group/t/how-to-disable-non-array-input-field-based-on-array-input-data/2322 "2024-09-04T07:13:35Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![bala](https://avatars.discourse-cdn.com/v4/letter/b/94ad74/32.png) [@bala](https://jsonforms.discourse.group/u/bala)\
**Post date:** [September 4, 2024, 7:13am UTC](https://jsonforms.discourse.group/t/how-to-disable-non-array-input-field-based-on-array-input-data/2322/1 "2024-09-04T07:13:35Z")

</div>

I have List with Detail control ([List With Detail Example - JSON Forms](https://jsonforms.io/examples/list-with-detail/)), Here is the schema json

```auto
{
  "type": "object",
  "properties": {
    "fee": {
      "properties": {
        "offers": {
          "type": "array",
          "items": {
            "type": "object",
            "properties": {
              "paymentType": {
                "type": "string",
                "enum": [
                  "Advance",
                  "On the fly"
                ]
              },
              "security": {
                "type": "string",
                "enum": [
                  "Debt",
                  "Equity",
                  "Certificates",
                  "Other"
                ]
              },
              "shares": {
                "type": "number",
                "decimalPattern": {
                  "pattern": "^\\d{0,12}$",
                },
              }
            },
            "required": [
              "paymentType",
              "security"
            ]
          }
        },
        "totalFee": {
          "properties": {
            "amountFees": {
              "type": "number",
              "decimalPattern": {
                "pattern": "^\\d{0,14}(\\.\\d{0,2})?$",
              },
            }
          }
        }
      }
    }
    }
}

```

Here is the Ui schema

```auto
{
  "type": "Category",
  "elements": [
    {
      "type": "VerticalLayout",
      "elements": [
        {
          "type": "ListWithDetail",
          "scope": "#/properties/fee/properties/offers",
          "options": {
            "labelRef": "security",
            "detail": {
              "type": "HorizontalLayout",
              "elements": [
                {
                  "type": "Control",
                  "scope": "#/properties/paymentType",
                  "options": {
                    "variant": "dropdown"
                  }
                },
                {
                  "type": "Control",
                  "scope": "#/properties/security",
                  "options": {
                    "variant": "dropdown"
                  }
                },
                {
                  "type": "Control",
                  "scope": "#/properties/shares",
                  "label": "Amount Being Registered",
                  "rule": {
                    "effect": "DISABLE",
                    "condition": {
                      "scope": "#/properties/paymentType",
                      "schema": {
                        "enum": [
                          "On the fly"
                        ]
                      }
                    }
                  }
                }        
              ]
            }
          }
        },
        {
          "type": "Control",
          "scope": "#/properties/fee/properties/totalFee/properties/amountFees",
           "rule": {
            "effect": "DISABLE",
            "condition": {
              "scope": "#/properties/paymentType",
              "schema": {
                "enum": [
                  "On the fly"
                ]
              }
            }
          }
        }
      ]
    }
  ]
 
}

```

The condition is when the user selects paymentType as “on the fly” in the array the field  
#/properties/fee/properties/totalFee/properties/amountFees, should be disabled. but when the user selects paymentType as “Advance”, the amountFees input field should be enabled, the amountFees is not part of ListWithDetail but separate input control. How can i achieve that?

---

<div class="post-metadata">

**Author:** ![lucas-koehler](https://yyz2.discourse-cdn.com/free1/user_avatar/jsonforms.discourse.group/lucas-koehler/32/336_2.png) [@lucas-koehler](https://jsonforms.discourse.group/u/lucas-koehler)\
**Post date:** [September 4, 2024, 2:54pm UTC](https://jsonforms.discourse.group/t/how-to-disable-non-array-input-field-based-on-array-input-data/2322/2 "2024-09-04T14:54:50Z")

</div>

Hi @bala ,  
before we dive into a potential solution, I have a question:  
The enablement of `amountFees` is supposed to be dependent on property `paymentType` in the array items.

What should happen if there are multiple array items and some have paymentType “Advance” while others have payment type “on the fly”?

---

<div class="post-metadata">

**Author:** ![bala](https://avatars.discourse-cdn.com/v4/letter/b/94ad74/32.png) [@bala](https://jsonforms.discourse.group/u/bala)\
**Post date:** [September 4, 2024, 2:59pm UTC](https://jsonforms.discourse.group/t/how-to-disable-non-array-input-field-based-on-array-input-data/2322/3 "2024-09-04T14:59:03Z")

</div>

In case of multiple array items, and one of the array items is “advance” then the amountFees should be enabled

---

<div class="post-metadata">

**Author:** ![bala](https://avatars.discourse-cdn.com/v4/letter/b/94ad74/32.png) [@bala](https://jsonforms.discourse.group/u/bala)\
**Post date:** [September 6, 2024, 6:06pm UTC](https://jsonforms.discourse.group/t/how-to-disable-non-array-input-field-based-on-array-input-data/2322/4 "2024-09-06T18:06:09Z")

</div>

can anyone help me on this @lucas-koehler

---

<div class="post-metadata">

**Author:** ![sdirix](https://yyz2.discourse-cdn.com/free1/user_avatar/jsonforms.discourse.group/sdirix/32/1073_2.png) [@sdirix](https://jsonforms.discourse.group/u/sdirix)\
**Post date:** [September 9, 2024, 10:32am UTC](https://jsonforms.discourse.group/t/how-to-disable-non-array-input-field-based-on-array-input-data/2322/5 "2024-09-09T10:32:14Z")

</div>

Hi @bala,

Yes this can be achieved with the `schema`-based rules. This is an example on how to define your rule:

```json
{
  "type": "Control",
  "scope": "#/properties/fee/properties/totalFee/properties/amountFees",
  "rule": {
    "effect": "ENABLE",
    "condition": {
      "scope": "#/properties/fee/properties/offers", // point to the array
      "failWhenUndefined": true, // if the array does not exist, fail the rule, i.e. disable the field
      "schema": {
        "contains": { // at least one entry of the array has an existing paymentType which is set to "Advance"
          "properties": {
            "paymentType": {
              "enum": ["Advance"]
            }
          },
          "required": ["paymentType"]
        }
      }
    }
  }
}

```

---

<div class="post-metadata">

**Author:** ![bala](https://avatars.discourse-cdn.com/v4/letter/b/94ad74/32.png) [@bala](https://jsonforms.discourse.group/u/bala)\
**Post date:** [September 9, 2024, 11:31am UTC](https://jsonforms.discourse.group/t/how-to-disable-non-array-input-field-based-on-array-input-data/2322/6 "2024-09-09T11:31:07Z")

</div>

@sdirix Thanks, it worked perfectly 🙂
