Take the 2-minute tour ×

I'd like for a single control to show a rich:popupPanel if it isn't visible, and hide it if it's already visible.

Following through the tutorials and code examples, I've come up with:

<h:outputLink value="#" id="loginLink">Login
    <rich:componentControl event="click"  operation="show" target="loginPane" >
        <a4j:param name="event" value="event" noEscape="true" />
        ... more params for positioning ...

<rich:popupPanel id="loginPane" autosized="true" modal="false" moveable="false" resizeable="false" followByScroll="false" onshow="#{rich:element('userName')}.focus()" >

Which shows my popupPanel and subsequent form well. I just can't recognize a way to overload that outputLink's componentControl to hide as well as show. Naturally "toggle" isn't a keyword - that would be too easy :) I'm pretty new with JSF and javascript, and have been trying various things for the better part of today. Can anyone recommend something to get me in the right direction?

share|improve this question
add comment

2 Answers

For me the following solution worked, while confirmPanel is the panel in the popup containing the updated data.

    <a4j:commandButton value="Delete" render="confirmPanel"
        <a4j:param value="#{record.id}" assignTo="#{showActivitiesAsTableView.selectedActivityId}" />
share|improve this answer
add comment
up vote 0 down vote accepted

In the end, I ended up just choosing the lazy route:

I edited the css of the page inline to take the rf-p-shade style not effect alpha and made an onmaskclick event to close the popup. I could not get it to replicate a "Toggle" like behavior with javascript or jsf notations.

share|improve this answer
add comment

Your Answer


