How to open and close rich:popupPanel from the same link

[yunaeyes00]

I follow this example from the showcase: http://showcase.richfaces.org/richfaces/component-sample.jsf?demo=popup&sample=login&skin=blueSky

it show how I can click on a link to open a popupPanel and append that panel to the same position of that link. But I want so that if I click again, it will close the panel. Anyone know how to achieve that? Here is my code

        <h:outputLink value="#" id="sb-dd-ol" >
            <rich:componentControl event="click" operation="show" target="sb-dd-pp">
                <a4j:param noEscape="true" value="event"/>
                <rich:hashParam>
                    <a4j:param noEscape="true" name="top"
                               value="jQuery(#{rich:element('sb-dd-ol')}.parentNode).offset().top + 
                                      jQuery(#{rich:element('sb-dd-ol')}.parentNode).height()" />
                    <a4j:param noEscape="true" name="left" 
                               value="jQuery(#{rich:element('sb-dd-ol')}.parentNode).offset().left" />
                </rich:hashParam>
            </rich:componentControl>
            Test
        </h:outputLink>
        <rich:popupPanel id="sb-dd-pp" autosized="true" modal="false" 
                         moveable="false" resizeable="false" followByScroll="false">
            This is a test
        </rich:popupPanel>

[liuliu]

how abaut 2 links with the same label, one hide another?

[yunaeyes00]

Is there a way hide one link and display another like u said without binding to the server bean. i want this to be completely on the client side

[liuliu]

i think you can do this with jquery.

something like jquery(this).toggle(); jquery(this).next().toggle()