LinkedIn
Copied!

Image control in DX API

The Image control (pxIcon) helps you insert images in forms. Learn about the JSON structure and elements of a sample Image control, to understand how you can integrate the element into your custom application.

The following JSON code is a sample API response for the Image control:

{
    "validationMessages": "",
    "visible": true,
    "labelReserveSpace": true,
    "readOnly": false,
    "control": {
        "modes": [
            {
                "modeType": "ignore",
                "tooltip": "",
                "iconProperty": ".Name",
                "iconSource": "property"
            },
            {
                "modeType": "readOnly",
                "autoPrepend": "",
                "controlFormat": "Standard",
                "tooltip": "",
                "showReadOnlyValidation": "false",
                "autoAppend": "",
                "iconProperty": ".Name",
                "formatType": "text",
                "iconSource": "property"
            }
        ],
        "actionSets": [
            {
                "actions": [
                    {
                        "action": "refresh",
                        "refreshFor": "VGVzdA%3D%3D"
                    }
                ],
                "events": [
                    {
                        "event": "change"
                    }
                ]
            },
            {
                "actions": [
                    {
                        "action": "refresh",
                        "refreshFor": "VGVzdA%3D%3D"
                    },
                    {
                        "action": "postValue"
                    }
                ],
                "events": [
                    {
                        "event": "focus"
                    },
                    {
                        "event": "click"
                    }
                ]
            }
        ],
        "type": "pxIcon"
    },
    "label": "Image",
    "type": "Text",
    "showLabel": true,
    "required": false,
    "validateAs": "",
    "reference": "pyTemplateGeneric",
    "labelFormat": "Standard",
    "disabled": false,
    "testID": "202008260747570122763",
    "value": "",
    "maxLength": 0,
    "expectedLength": "",
    "fieldID": "pyTemplateGeneric"
}

The following examples show a sample configuration of the control with the relevant JSON elements:

Cell properties - General tab
Cell properties - General tab
  • When rules that are part of conditions, such as Visibility and Disable, return boolean values.
  • For conditions, such as Visibility or Disable, for the Condition (when rule) option, negation with the logical operator (!) is supported. For example, !pzVisibleWhen.
  • Fields, such as Helper text, return the corresponding value from the associated Pega rules.
  • For conditions, such as Visibility and Disable, only the Always and Condition (when rule) options are supported.
  • If the iconSource element is set to standardIcon, the iconStandard element is included in the response.
  • If the iconSource element is set to image, the iconImage element is included in the response.
  • If the iconSource element is set to exturl, the iconURL element is included in the response.
  • If the iconSource element is set to property, the iconProperty element is included in the response.
  • If the iconSource element is set to styleclass, the iconStyle element is included in the response.
DX API attributes
DX API attributes
The response returns the name-value pairs that you add to the DX API attributes of the control as part of the customAttributes element.
Property referenced in the control - General tab
Property referenced in the control - General tab
Property referenced in the control - Advanced tab
Property referenced in the control - Advanced tab
The message in the validationMessages element is displayed when the validation in the validateAs element fails.
Cell properties - Presentation tab
Cell properties - Presentation tab
Suggest Edit
Did you find this content helpful?

Have a question? Get answers now.

Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.