Universal Editor field configuration: conditional editability and DAM alt text

[Ben_Hu]

Hi everyone,

Our team is currently working with Edge Delivery Services and the Universal Editor, using the aem-boilerplate-xwalk project.

We’re trying to implement a feature, when uploading an image, user can either manually enter the alt text or have it pulled directly from the DAM. This has raised two questions based on the documentation here: https://experienceleague.adobe.com/en/docs/experience-manager-cloud-service/content/implementing/dev... (PS: If there are any additional component specification references or articles, I’d really appreciate it if you could share them.)

1. The docs describe using "condition" to show or hide a field and the "readOnly" to change the field is editable or not. However, our use case is slightly different. We’d like to control whether the tab_iconAlt field is editable, based on the boolean value of tab_iconAltFromDam. Is there a way to use one boolean field to determine whether another field is readOnly or to adjust its value?

2. If we want to read the image’s alt text from the DAM based on the reference path, what would be the correct implementation approach?

Any documentation or suggestions would be extremely helpful. Thanks!

Current field

    {

        "component": "reference",

        "name": "tab_icon",

        "label": "Tab Icon",

        "valueType": "string",

        "multi": false

    },

    {

        "component": "text",

        "name": "tab_iconAlt",

        "label": "Alternative Text",

        "valueType": "string",

        "readOnly": false

    },

    {

        "component": "boolean",

        "name": "tab_iconAltfromdam",

        "label": "Get alternative text from DAM",

        "valueType": "boolean"

    }

[kautuk_sahni]

@daniel-strmecki @lukasz-m @Shashi_Mulugu @Raja_Reddy @ShaileshBassi @Uppari_Ramesh @sudhansh @Mahedi_Sabuj @Pallavi_Shukla_ could you kindly take a look at this question when you have a moment? Your insights are much appreciated!

[daniel-strmecki]

Hi @Ben_Hu,

I've used JSON forms (https://jsonforms.io/docs/) to achieve a similar kind of hide/show functionality, but that was for the new Content Fragments Editor. Maybe you can check with Adobe Support if JSON forms are supported in the Universal Editor? It might be not be GA yet.

Here is an example of how to set it up for Content Fragments:

curl -i -X PUT \
  'https://author-p<ADD_CORRENT_PROJECT_ID>-e<ADD_CORRENT_ENVIRONMENT_ID>.adobeaemcloud.com/adobe/sites/cf/models/<ADD_CF_MODEL_ID>/uiSchema' \
  -H 'Authorization: Bearer <ADD_TOKEN_HERE>' \
  -H 'Content-Type: application/json' \
  -H 'If-Match: <ADD_ETAG_HERE>' \
  -H 'X-Adobe-Accept-Unsupported-API: 1' \
  -d '{
    "uiSchema": {
        "type": "VerticalLayout",
        "elements": [
            {
                "type": "Control",
                "label": "Form provider",
                "scope": "#/properties/formProvider"
            },
            {
                "type": "Control",
                "label": "Form ID",
                "scope": "#/properties/formId",
                "rule": {
                    "effect": "HIDE",
                    "condition": {
                        "scope": "#/properties/formProvider",
                        "schema": {
                            "enum": [
                                "marketo",
                                "onetrust"
                            ]
                        }
                    }
                }
            }
        ]
    }
}'

Good luck,

Daniel