How to keep attribute for empty string value in sightly | Community
Skip to main content
New Participant
Sep 6, 2019 12:00 PM UTC
Solved

How to keep attribute for empty string value in sightly

In sightly if i am getting empty string value then i am not getting that attribute in html page. I am using AEM 6.4

e.g  <sly data-sly-test.iconVal=" ">

<a data-icon="${iconVal}" />

here i am not getting data-icon attribute in html page because iconVal value is empty string.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
user05162Accepted solution
Employee
Sep 6, 2019 1:03 PM UTC

Note that an attribute (either literal or set via data-sly-attribute) whose value evaluates to the empty string will be removed in the final markup. The one exception to this rule is that a literal attribute set to a literal empty string will be preserved. For example,

For example,

<div class="${''}" data-sly-attribute.id="${''}"></div>

produces,

<div></div>

but,

<div class="" data-sly-attribute.id=""></div>

produces,

<div class=""></div>

So, try to set a literal value to the attribute if its null.

2 replies

user05162Accepted solution
Employee
Sep 6, 2019 1:03 PM UTC

Note that an attribute (either literal or set via data-sly-attribute) whose value evaluates to the empty string will be removed in the final markup. The one exception to this rule is that a literal attribute set to a literal empty string will be preserved. For example,

For example,

<div class="${''}" data-sly-attribute.id="${''}"></div>

produces,

<div></div>

but,

<div class="" data-sly-attribute.id=""></div>

produces,

<div class=""></div>

So, try to set a literal value to the attribute if its null.

Translate
RashidJorvee
Level 4
Jan 7, 2022 4:45 AM UTC

Hi @user05162 

<div class="" data-sly-attribute.id=""></div> is not producing <div class=""></div>, but <div class></div>.

 

Any idea how we could set empty attribute value e.g. <img alt="" scr="/content/dam" />

 

I am trying <img  src="${jorvee.image}" alt="${jorvee.imageAlt || ''}"/> but final HTML is getting generated like this <img  src="/contant/dam/abc.jpg" /> when imageAlt is empty.

 

Thank you

Translate