How to remove empty div generated (<div class="col-12 col-md-8 "></div>) if parys is included with below sightly code and parsys node do not contains any child node i.e. no component dragged and dropped in parsys :
<div class="col-12 col-md-8 " data-sly-resource="${'col' @ resourceType='wcm/foundation/components/parsys'}"></div>
Solved! Go to Solution.
Views
Replies
Total Likes
To avoid this use one dummy class in empty divs e.g. req-div
<div class="img-div req-div"></div>
$('div:empty').not('.req-div').remove();
Views
Replies
Total Likes
you need to write a check to identify mandatory values to display div and use unwrap with test in sightly.
Views
Replies
Total Likes
Existing code has the same way of including parsys at nearly 90 places, putting the check in all these places looks a bit messy.
Any other cleaner approach ?
Views
Replies
Total Likes
Then you can go with jquery to find and remove empty div when page load.
$('.common-selector-class:empty').remove();
Or
$('div:empty').remove();
Views
Replies
Total Likes
This approach hides required div(s) too, like in case of image where image is loaded based on class or style attribute of an empty div. If I try to exclude the existing image classes , if a new image class gets added in code, this will break again.
Views
Replies
Total Likes
To avoid this use one dummy class in empty divs e.g. req-div
<div class="img-div req-div"></div>
$('div:empty').not('.req-div').remove();
Views
Replies
Total Likes
Views
Likes
Replies
Views
Likes
Replies