Form component checkbox not returning value

Hi all,

I’m using a form component that contains a list of checkboxes. When a checkbox is selected, I expect its associated value to be returned in the widget’s data list.

Instead, the data list only returns true or false, which appears to correspond to the index or selected state of each checkbox rather than its configured value.

Is it not suppose to just return a list of values based on what I selected ie,

['Administrator'] or ['Administrator','Operator']

{
  "id": "roles",
  "type": "checkbox",
  "checkbox": {
    "type": "boolean",
    "options": [
      {
        "text": "Administrator",
        "value": "Administrator",
        "triState": false
      },
      {
        "text": "Operator",
        "value": "Operator",
        "triState": false
      },
      {
        "text": "Supervisor",
        "value": "Supervisor",
        "triState": false
      },
      {
        "text": "test",
        "value": "test",
        "triState": false
      }
    ],
    "layout": "row",
    "align": "center",
    "justify": "start",
    "textPosition": "right",
    "checkedIcon": {
      "path": "material/check_box",
      "color": {
        "enabled": "#5b9cf6",
        "disabled": ""
      }
    },
    "uncheckedIcon": {
      "path": "material/check_box_outline_blank",
      "color": {
        "enabled": "",
        "disabled": ""
      }
    },
    "validation": {
      "constraints": {
        "required": {
          "enabled": false
        }
      },
      "style": {
        "classes": ""
      }
    },
    "style": {
      "classes": "keycloak-role-chips"
    },
    "optionStyle": {
      "classes": "keycloak-role-chip"
    }
  },
  "visible": true,
  "enabled": true,
  "layout": "column",
  "label": {
    "text": "Roles",
    "style": {
      "classes": "keycloak-label"
    }
  },
  "info": {
    "text": "",
    "type": "caption"
  },
  "tabIndex": 7,
  "style": {
    "classes": "keycloak-form-group"
  }
}

No, the value of a checkbox is its boolean state.

A boolean can't have a value of type 'string'.

A crude workaround:

  1. Create a custom property 'roles' on the form component.
  2. Create a Property binding on the custom prop.
  3. Monitor the data.roles of the form.
  4. When it changes generate the list using the script below.
def transform(self, value, quality, timestamp):
    options = ["Administrator", "Operator", "Supervisor", "test"]
    selected = []
    for r in range(len(self.props.data.roles)):
        if value[r]:
            selected.append(options[r])
            
    return selected

This has the problem that you now have to keep the options list synchronised with the form options. This won't be obvious to anyone else editing the application later.

If you're smart you could modify the script to iterate through the columns.items.0.rows.items searching for widget.0.roles and then iterate through that node's checkbox.options and extract the text properties and pop them into my options array above. If I was smart I'd show you how. :roll_eyes:

The trouble with scripted work-arounds (or any kind of bindings within the form component) is that they cannot work in offline mode, a key feature of the form component.

The association between the checked boxes and the text strings needs to be performed in the form delivery event, not in any binding.