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

Parsys Issue in Tabs

Avatar

Level 5

Hi

I have issue in tabs as i can see the parsys area gets shrink when i open the other tab. After some findings i an using the attached code to hide the parsys for the tabs not open. Below is my jsp code where i am not getting where to call show / hide functions as given in attached file. Below is my jsp code.

<div class="tab-content"> <c:forEach var="tabTitle" items="${tabAttributes}" varStatus="theCount"> <c:choose> <c:when test="${theCount.index eq 0}"><c:set var="activeClass" value=" active" /> </c:when> <c:otherwise> <c:set var="activeClass" value="" /> </c:otherwise> </c:choose> <div class="tab-pane ${tabTitle.value[1]} " id="${tabUniqueName}home${theCount.index}" > <cq:include path="${res.parent.path}/content/par/${tabTitle.value[0]}" resourceType="foundation/components/parsys"/> <c:if test="${wcmMode}"> <br/><br/> </c:if> </div> </c:forEach> </div>

Tabs items are as follows :

/jcr:content/mainContent/tabs/options/item_1,/jcr:content/mainContent/tabs/options/item_2,/jcr:content/mainContent/tabs/options/item_3

Thanks

1 Accepted Solution

Avatar

Correct answer by
Level 10

I am not sure which client library you are using to render tabs. From class name I am guessing it is bootstrap. If so follow [1] to call show/hide function.   If otherframework find an event for tab click & call the function there.

[1]   http://stackoverflow.com/questions/8136904/twitter-bootstrap-tabs-and-javascript-events

View solution in original post

1 Reply

Avatar

Correct answer by
Level 10

I am not sure which client library you are using to render tabs. From class name I am guessing it is bootstrap. If so follow [1] to call show/hide function.   If otherframework find an event for tab click & call the function there.

[1]   http://stackoverflow.com/questions/8136904/twitter-bootstrap-tabs-and-javascript-events