AEM 6.5 Designer not displaying ImageField | Community
Skip to main content
P
plummer6699
Level 2
August 28, 2024
Question

AEM 6.5 Designer not displaying ImageField

  • August 28, 2024
  • 3 replies
  • 1460 views

Hi.  Here is my scenario.  I have a couple of ImageFields that point to different images that are watermarks and they both are bound to the same data binding element.  Now using JavaScript in designer....i would like to display one or the other, (possibly more) depending on value of the bound field.  ie:  If element is 'A' then use imageField1, or if 'B' use imageField2, etc.    When I add the binding, and JavaScript below.....it does not seem to work at all when I preview.

Any help is appreciated.

javascript:

Document_Instance.Page1.ImageField1::initialize - (JavaScript, client)
var watermark_name = ImageField1.rawValue;
if (watermark_name == 'draft') {
this.access="readOnly";
this.presence="visible";
}

3 replies

SachinJa4
SachinJa4
Level 2
August 29, 2024

May be try this

Ensure that you access the data binding field correctly. You should retrieve the value from the bound field and use it to decide which image to display.

In your JavaScript, you'll need to set the source of the image field based on the value retrieved from the bound field.

 

Though your code don't have problem but this legacy tool is sometime working weird. Try the below code snippet

 

/**************
var watermark_name = this.resolveNode("Page1.boundFieldName").rawValue;

// Replace 'boundFieldName' with the actual name of your bound field.


if (watermark_name == 'A') {
this.resolveNode("Page1.ImageField1").presence = "visible";
this.resolveNode("Page1.ImageField2").presence = "hidden";
this.resolveNode("Page1.ImageField1").rawValue = "path/to/your/imageA.png"; // Set the source to image A.
} else if (watermark_name == 'B') {
this.resolveNode("Page1.ImageField1").presence = "hidden";
this.resolveNode("Page1.ImageField2").presence = "visible";
this.resolveNode("Page1.ImageField2").rawValue = "path/to/your/imageB.png"; // Set the source to image B.
} else {
// Handle cases where watermark_name does not match 'A' or 'B'
this.resolveNode("Page1.ImageField1").presence = "hidden";
this.resolveNode("Page1.ImageField2").presence = "hidden";
}

***********************************/

 

Also , Use console.log to print out values and ensure the data is being accessed correctly.

P
plummer6699Author
Level 2
August 29, 2024

Hey thanks for replying!  

Unfortunately it does not solve my problem.  

Couple of things: 
1.

var watermark_name = this.resolveNode("Page1.boundFieldName").rawValue;

// Replace 'boundFieldName' with the actual name of your bound field.

ImageField1 is bound to $.Document_Description.Watermark_Name which brings back the correct watermark name of 'draft'.

 

2. this.resolveNode("Page1.ImageField1").rawValue = "path/to/your/imageA.png"; // Set the source to image A.

I don't want to replace the value of ImageField1.  I think you want change the URL to the 'path/to/your/imageA.png'

and how do i do that?

 

I do not get any errors in the console.

 

I guess I am confused on how to reference (through JavaScript) ..... the DataView elements as well.

Anymore comments are greatly appreciated!

Thanks.

P
plummer6699Author
Level 2
August 29, 2024

UPDATE:

so spitting out some messagebox's......I found this.

this.resolveNode("Page1.ImageField1").rawValue = "..\common\images\DRAFT.png";

resolves to this.... '..commonimagesDRAFT.png' (yes without the slashes).  Any idea around this?

 

Thx.

V
Adobe Employee
VijaySr1Adobe Employee
Adobe Employee
September 11, 2024

Hi @plummer6699 ,

 

Can you please try to apply below solutions:

Sol 1.Use data binding reference and avoid using named data binding.

Sol 2. You can also add the mergeMode to "matchTemplate" as attribute in root subform as " <subform layout="tb" locale="es_ES" name="name" mergeMode="matchTemplate">

 

Possible explanation why it is not visible in preview? is below:

By Default when we use "use name" data binding it always exclude data Nodes which are already bound. That may be the reason why the same data node is not bind to second image field.

 

Note: Please try to apply sol1 or sol2 and let me know if it works. Please share the template and sample data in case these solutions does not work.

 

Thanks

    kautuk_sahni
    Community Manager
    kautuk_sahniCommunity Manager
    Community Manager
    January 29, 2025

    @plummer6699 Did you find the suggestions helpful? Please let us know if you require more information. Otherwise, please mark the answer as correct for posterity. If you've discovered a solution yourself, we would appreciate it if you could share it with the community. Thank you!

    Kautuk Sahni
    Terms & ConditionsAccessibility statement

    Loading footer...