CODEWITHSUNDEEP
aemaem-6
xMilos
xMilos

Reputation: 2028

AEM access component properties inside a dialog

I have following part inside a component dialog:

            <imgPreview
                                        jcr:primaryType="nt:unstructured"
                                        sling:resourceType="aem-project/components/imgPreview"
                                        baseUrl="https://photo1.com"
                                        name="imgPreview"/>

the component has the following property among others:

fileReference - String -  https://photo2.com

what I want to achieve is something like baseUrl=${properties.fileReference} the baseUrl to point to the component property.

Is it possible access component property directly inside the dialog ?

Upvotes: 1

Views: 1539

Answers (1)

Siwol27
Siwol27

Reputation: 70

You said this imgPreview component is inside other component's dialog, then I'll say the name of that "other component" as "parent", for convenience.

What you're looking for is how to use parent's "fileReference" property value inside imgPreview, right?

I think this is not exact way you were looking for, but I think what you want might be achieved with this way.

Create a js file and write code like this at parent component's authoring dialog clientlibs.

$(document).on("dialog-ready", function() { 
    // getting fileReference property value inside parent component's dialog
    const fileRefEl = $("[name='./fileReference']");


    // select the tag to use fileReference value inside imagePreview component
    const imgPreviewEl = $(tagSelector);


    if (fileRefEl && imgPreviewEl) {
        // use fileReference value as you want
        // example : imgPreviewEl.attr("src", fileRefEl.val());
    } 
});

You can get the values of parent component's properties at js file in authoring dialog clientlibs, and you can pass it into imgPreview component's html directly, because you put imgPreview inside the dialog.

If you want to know how to use authoring dialog clientlibs, this video might be helpful.

Upvotes: 1

Related Questions