open and close richfaces modal panel with jQuery

Question

I use richfaces in a project, and for some need I have to display a popup after a click on a div. How to open and close richfaces modal panel with jQuery?

panel.jsp:

<rich:modalPanel id="controlWorkflowEditor" width="430"
    trimOverlayedElements="false" resizeable="false" autosized="true">
    <f:facet name="header">
        <h:panelGroup>
            <h:outputText value="#{bpmnEditorLocal['choisirUnWorkflow']}">
            </h:outputText>
        </h:panelGroup>
    </f:facet>

    <h:form id="controlWorkflow">
        <h:panelGroup id="controlGroupPanelId">
            <table>
                <!--  ######### WORKFLOW CONTROL EDITOR  ############ -->
                <tr>
                    <td><h:outputLabel value="#{bpmnEditorLocal['workflow']} *" />
                    </td>
                </tr>
            </table>
        </h:panelGroup>
        <br />
        <br />
    </h:form>
</rich:modalPanel> 

Answer 1

In RichFaces 3.x you can use javascript for show/hide the modal panel:

Show:

Richfaces.showModalPanel('modalPanelId')

or

#{rich:component('modalPanelId')}.show()

Hide:

Richfaces.hideModalPanel('modalPanelId')

or

#{rich:component('popup')}.hide()

Example:

<h:graphicImage value="/images/icons/close.png" style="cursor:pointer" 
    onclick="Richfaces.hideModalPanel('modalPanelId')" />