3 Replies Latest reply on May 7, 2008 9:36 AM by Mahesh M

    Render Modal Panel dynamically

    Mahesh M Newbie

      I am using Richfaces 3.1.4 GA. I am trying to render a rich modal panel dynamically.

      In my BackingBean I have a method through which I want to launch the modalPanel based on some condition. I am trying the following way, but it dosen't seem to render the modal panel.

      Can someone please tell what's the right way to do it.


      My modal code is as shown below

      <rich:modalPanel id="testPanel" minHeight="500" minWidth="500" width="500" height="600" left="200" top="150" zindex="500">
       <f:facet name="header">
       <h:outputText value="Header" />
       <f:facet name="controls">
       <h:graphicImage value="/images/close.png" style="cursor:pointer" onclick="Richfaces.hideModalPanel('testPanel')" />
       <h:outputText value="Note:" />
       <f:verbatim> </f:verbatim>
       <h:outputText value="#{backingBean.note}" />
      Backing Bean
      public BackingBean {
       public void launch(){
       UIComponent component = FacesContext.getCurrentInstance().getViewRoot().findComponent("testPanel");
       HtmlModalPanel panel = (HtmlModalPanel)component;

        • 1. Re: Render Modal Panel dynamically
          Ilya Shaikovsky Master

          Let for example you use some a4j:control to call some action. In some cases after this action you should render the modal.. In this case I think more simple way will be:

          1) Create some boolean property in your bean which will indicate if the panel should be called.
          2) define this property via data attribute of your a4j action component
          3) in oncomplete check the value of the property and call the panel if need.

          • 2. Re: Render Modal Panel dynamically
            Mahesh M Newbie

            The ModalPanel is already rendered when the parent page loads because it is included in the parent page. I want to just show/hide the modalpanel based on some condition from my backing bean.

            I am trying to do equivalent of how the two buttons "Test" and "Cancel" work, from my backing bean. Clicking Test shows the modalpanel and clicking Cancel hides it.

            <a4j:commandButton value="Test" onclick="ajaxBusy();" oncomplete="ajaxIdle();Richfaces.showModalPanel('testPanel')"
            action="#{backingBean.testAction}" reRender="newContract" />
            <a4j:commandButton value="Cancel"
            onclick="Richfaces.hideModalPanel('testPanel');" />
            All I am trying to do is like this in my backing bean.
             // The showModalPanel variable is set based on some business logic.
             // Here I want to do Something similar to Richfaces.showModalPanel('testPanel')

            So can you please tell what is the equivalent of Richfaces.showModalPanel('testPanel')/Richfaces.hideModalPanel('testPanel')calling from java code/modalPanel API.


            • 3. Re: Render Modal Panel dynamically
              Mahesh M Newbie

              Anyone has any tips about how to show ModalPanel using some API or setting some property on Modalpanel component similar to invoking Richfaces.showModalPanel on the click of a button from the jsp.

              Is there any other way to do this?