<div dir="ltr">Looks like I found a way :)<div><br></div><div>Modifying TBSAccordionItem to the following:<br><div><br></div><div><div>TBSAccordionItem &gt;&gt; renderHeadingOn: html</div><div><br></div><div><span class="" style="white-space:pre">        </span>html tbsPanelHeading: [</div><div><span class="" style="white-space:pre">                        </span>html anchor</div><div><span class="" style="white-space:pre">                                </span>attributeAt: &#39;data-toggle&#39; ifAbsentPut: &#39;collapse&#39;;</div><div><span class="" style="white-space:pre">                                </span><b>onClick: (html jQuery ajax</b></div><div><b><span class="" style="white-space:pre">                                                                        </span>script: [ :s | </b></div><div><b><span class="" style="white-space:pre">                                                                                </span>self isCollapsed: self isCollapsed not.</b></div><div><b><span class="" style="white-space:pre">                                                                                </span>s &lt;&lt; JSStream on: &#39;$(&#39;&#39;#&#39;, self uniqueIdString, &#39;&#39;&#39;).collapse()&#39;</b></div><div><b><span class="" style="white-space:pre">                                                                        </span>]);</b></div><div><span class="" style="white-space:pre">                                </span>url: &#39;#&#39;, self uniqueIdString;</div><div><span class="" style="white-space:pre">                                </span>with: self title</div><div><span class="" style="white-space:pre">                </span>]</div></div></div><div><br></div><div>Added the onClick:  part assuming that #renderBodyOn: html  was already doing:</div><div><br></div><div><div><span class="" style="white-space:pre">        </span>self isCollapsed ifFalse: [styleClasses := styleClasses, &#39; in&#39;].</div></div><div><br></div><div>What do you think?</div></div><div class="gmail_extra"><br><div class="gmail_quote">On Fri, Jul 22, 2016 at 5:38 PM, Mariano Martinez Peck <span dir="ltr">&lt;<a href="mailto:marianopeck@gmail.com" target="_blank">marianopeck@gmail.com</a>&gt;</span> wrote:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div dir="ltr">Hi Torsten,<div><br></div><div>Thanks for your accordion! I was taking a look to it and I have a question: </div><div><br></div><div>I made sure to keep using the same instance of <span style="font-family:Verdana;font-size:12px">TBSAccordion but the problem I have is that when I collapse or expand, that is lost as soon as I refresh the page or the containing component, which makes it useless for me. So.. is there a way the component itself knows how to memorize whether it was expanded or not? I see </span><font face="Verdana"><span style="font-size:12px">TBSAccordionItem has a &#39;isCollapsed&#39; instVar but it loooks to be used only at #initialize.</span></font></div><div><font face="Verdana"><span style="font-size:12px"><br></span></font></div><div><font face="Verdana"><span style="font-size:12px">Thoughts?</span></font></div><div><font face="Verdana"><span style="font-size:12px"><br></span></font></div><div><font face="Verdana"><span style="font-size:12px">Thanks!</span></font></div><div><span style="font-family:Verdana;font-size:12px"><br></span></div><div><span style="font-family:Verdana;font-size:12px"><br></span></div></div><div class="gmail_extra"><br><div class="gmail_quote"><div><div class="h5">On Wed, Jun 3, 2015 at 8:08 AM, Torsten Bergmann <span dir="ltr">&lt;<a href="mailto:astares@gmx.de" target="_blank">astares@gmx.de</a>&gt;</span> wrote:<br></div></div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div><div class="h5"><div><div style="font-family:Verdana;font-size:12.0px"><div>Hi Thomas + Seaside list,</div>

<div> </div>

<div>I implemented an accordion widget in bootstrap project. One can use a block or</div>

<div>a seaside component for the items of the accordion.</div>

<div> </div>

<div>    accordion := TBSAccordion new.<br>
    accordion <br>
        add: [:html | html text: &#39;Some content&#39; ] title: &#39;A block&#39;;<br>
        add: [:html | html text: &#39;Some more content&#39; ] title: &#39;Item 2&#39;;<br>
        add: WACounter new title: &#39;A component&#39;.</div>

<div> </div>

<div>If required it is possible to do own custom rendering by providing a subclass of</div>

<div>TBSAccordionItem and adding this to the accordion using #addItem:</div>

<div>instead of using #add:title:</div>

<div> </div>

<div>A demo is online:</div>

<div> </div>

<div><span style="line-height:1.6em">  <a href="http://pharo.pharocloud.com/bootstrap/browser/Accordion" target="_blank">http://pharo.pharocloud.com/bootstrap/browser/Accordion</a></span></div>

<div> </div>

<div>Just update the code to the latest version or grab the latest image from PharoLauncher or CI</div>

<div>(<a href="https://ci.inria.fr/pharo-contribution/job/Bootstrap/" target="_blank">https://ci.inria.fr/pharo-contribution/job/Bootstrap/</a>)</div>

<div><br>
<span style="line-height:19.2000007629395px">Hope this helps getting started or use as a template for own experiments.</span></div>

<div> </div>

<div> </div>

<div>Thx</div><span><font color="#888888">

<div>T. </div>

<div> </div></font></span></div></div>
<br></div></div><span class="">_______________________________________________<br>
seaside mailing list<br>
<a href="mailto:seaside@lists.squeakfoundation.org" target="_blank">seaside@lists.squeakfoundation.org</a><br>
<a href="http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside" rel="noreferrer" target="_blank">http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside</a><br>
<br></span></blockquote></div><span class="HOEnZb"><font color="#888888"><br><br clear="all"><div><br></div>-- <br><div data-smartmail="gmail_signature">Mariano<br><a href="http://marianopeck.wordpress.com" target="_blank">http://marianopeck.wordpress.com</a><br></div>
</font></span></div>
</blockquote></div><br><br clear="all"><div><br></div>-- <br><div class="gmail_signature" data-smartmail="gmail_signature">Mariano<br><a href="http://marianopeck.wordpress.com" target="_blank">http://marianopeck.wordpress.com</a><br></div>
</div>