Sly logic mismatching

[JakeCham]

Hi Team,

I have a simple sly logic to wrap a div in two places and it is not working for closing div. any suggestions ?

<sly data-sly-test="${false}">  // this sly isn't going inside when it is false as expected
    <div> //opening div
</sly>
//HERE OTHER HTL AND HTML CODE IS THERE

<sly data-sly-test="${false}"> // this sly is going inside even it is false
   test1   //this line is not executing when condition of sly is false as expected

      </div>  //closing div, this line is executing when condition of sly is false

   test2   //this line is executing  when condition of sly is false
</sly>

output when false

</div>

test2

So at the end I'm experiencing an extra closing div. The opening div hasn't been executing while ending div executing with the same logic that make a extra closing div in the html structure. Any suggestion would be appreciated.

Thank in advance 

[Shubham_borole]

@JakeCham 

Have you tried 

<div  data-sly-test.var="a" > Show content here</div>

If the condition is met, the content and div would be shown, if not nothing will show is what I understand.

[JakeCham]

<sly data-sly-test="${false}"> /
    <div>        // when the result is false this line isn't executing as expected
</sly>
//HERE OTHER HTL CODE IS THERE
<sly data-sly-test="${false}"> // this sly is not working as expected while same logic at top is working

    a      // when the result is false this line isn't executing as expected
    </div> // when the result is false still this line is executing 

    b // when the result is false still this line is executing 
</sly>

here when it is false sly logic on top is working but sly logic at bottom is not working.when result is false bottom sly logic is going inside and executing and printing </div> and ''b''.

[arunpatidar · Accepted solution]

use data-sly-unwarp

<div data-sly-unwrap="${false}">
// here otehr htl code
</div> 

outputs: 
<div>
// here otehr htl code
</div>

[JakeCham]

<sly data-sly-test="${false}"> /
    <div>        // when the result is false this line isn't executing as expected
</sly>
//HERE OTHER HTL CODE IS THERE
<sly data-sly-test="${false}"> // this sly is not working as expected while same logic at top is working

    a      // when the result is false this line isn't executing as expected
    </div> // when the result is false still this line is executing 

    b // when the result is false still this line is executing 
</sly>

here when it is false sly logic on top is working but sly logic at bottom is not working. When the result is false bottom sly logic is going inside and executing and printing </div> and ''b''.

[arunpatidar]

Hi,

You need to use data-sly-unwrap not data-sly-test to remove or add parent divs based on some condition.

[JakeCham]

Thanks a lot. It works!