Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

Reference new properties in HTML file

Avatar

Level 3

Hello

 

I’m struggling to display the new properties that I added in form options..

Just to give a little bit of context, I’m want to extend the form option component  and add some new option (Title, URL and Image), I’ve successfully added those option as we can see in the image below

odabio_0-1634986510733.png

 

My issue is that I cannot reference the newly added option in my html (imageview.html) here’s my here’s the content of the file:

odabio_1-1634986510740.png

 

 

CRXDE.png

 

 

 

 

 

 

 

 

 

Gist link to some files:

_cq_dialog/.content.xml: https://gist.github.com/odaBio/e8ebb790d0541b6cb295d2b72dbb6246

Imageview.html: https://gist.github.com/odaBio/e9d97c25539f949e108487e1f301ddaf

ImageView.javahttps://gist.github.com/odaBio/bb977ff6296d9fbdecee481b8c18540c

ImageViewImpl.javahttps://gist.github.com/odaBio/3cad00f7b5014b69abbe0b5aa1501053

OptionItem.javahttps://gist.github.com/odaBio/4f52045f8b124e6dcd2a3fa7b858c2de

OptionItemImpl.javahttps://gist.github.com/odaBio/5087321aec7016564383b0c44ee8ab1e

 

Is there any way that I can reference the Title, url and image in my HTML ?

Thanks in advance.

1 Accepted Solution

Avatar

Correct answer by
Level 4

Hi @odabio ,

I can see you have created a new sling model for ImageView, but in the HTL you are using "com.adobe.cq.wcm.core.components.models.form.Options" which may not have your new members. What you can do is extend Options model with your sling model and then add you new members and then you can refer sling model which you have created.

 

Refer this article https://github.com/adobe/aem-core-wcm-components/wiki/Delegation-Pattern-for-Sling-Models on extending a core component.

 

Thanks!

View solution in original post

7 Replies

Avatar

Community Advisor

HI @odabio 

 

Have you included these additional properties in the sling model class where you are trying to refer the object in HTL?

 

If these additional fields are not included, you will not be able to use the fields in HTL and it will always return null.

 

Thanks!

Avatar

Community Advisor

Could u pls ur sling model as well?

Avatar

Community Advisor

Hi @odabio ,

      Did you inject the above 3 field in the options sling model.

Regards,

Sanjay

Avatar

Correct answer by
Level 4

Hi @odabio ,

I can see you have created a new sling model for ImageView, but in the HTL you are using "com.adobe.cq.wcm.core.components.models.form.Options" which may not have your new members. What you can do is extend Options model with your sling model and then add you new members and then you can refer sling model which you have created.

 

Refer this article https://github.com/adobe/aem-core-wcm-components/wiki/Delegation-Pattern-for-Sling-Models on extending a core component.

 

Thanks!