6 Replies Latest reply on Dec 5, 2008 6:59 AM by kranthi kumar

    problem in rich modal panel

    kranthi kumar Newbie

      Hi All,

      I have a datatable in the basepage.If an image in the datatable is clicked , the popup is displayed.I have used rich:modalpanel for the
      popup.
      In the popup, there is a search button and a datatable.If the search button is clicked the datatable should be populated.The problem is, the action method is executed but the datatable is not populated.The popup is not rerendered.I have used 'a4j:commandButton' for the search button.
      If h:commandButton is used instead of a4j:commandButton ,the popup will disappear.Kindly help me out in solving this problem.

        • 1. Re: problem in rich modal panel
          Kerdudou Ronan Apprentice

          can you give more details (code for exemple)

          have you put the correct "rerender" in the a4j:commandbutton

          • 2. Re: problem in rich modal panel
            kranthi kumar Newbie

            Hi RonanKER,

            Thanks for the reply.This is my code;

            -------start of basepage datatable------

            <h:datatable value="#{healthSystemBean.list}" var="list1">
            <h:column>
            <f:facet="header">
            <h:outputText value="Name">
            </f:facet>
            <h:outputText value="#{list1.name}"/>
            </h:column>
            <h:column>
            <f:facet="header">
            <h:outputText value="facilities">
            </f:facet>
            <rich:modalPanel id="panel" width="750" height="250">
            <f:facet name="controls">
            <h:panelGroup>
            <h:graphicImage value="/images/close.png" id="hidelink" />
            <rich:componentControl for="panel" attachTo="hidelink" operation="hide" event="onclick" />
            </h:panelGroup>
            </f:facet>
            <a4j:commandButton value="search" reRender="panel"
            action="#{popBean.search}" >
            <rich:componentControl for="panel" operation="show"
            disableDefault="true" event="onclick" />
            </a4j:commandButton>

            -------start of modal panel datatable---------

            <h:dataTable value="#{popBean.list}" var="list2" id="poplist" >
            <h:column>
            <f:facet name="header">
            <h:outputText value="Server ID"></h:outputText>
            </f:facet>
            <h:outputText value="#{list2.serverId}" />
            </h:column>
            <h:column>
            <f:facet name="header">
            <h:outputText value="Server Name"></h:outputText>
            </f:facet>
            <h:outputText value="#{list2.serverDescription}"/>
            </h:column>
            </h:dataTable>
            </rich:modalPanel>
            <h:outputLink id="link" value="#">
            <h:graphicImage value="/images/SEARCH.GIF" border="0">
            <rich:componentControl for="panel" attachTo="link" operation="show" event="onclick" />
            </h:outputLink>
            </h:column>
            <h:datatable>

            • 3. Re: problem in rich modal panel
              Kerdudou Ronan Apprentice

              easier to read like this :

              <%-------start of basepage datatable------%>
              <h:datatable value="#{healthSystemBean.list}" var="list1">
               <h:column>
               <f:facet="header">
               <h:outputText value="Name">
               </f:facet>
               <h:outputText value="#{list1.name}"/>
               </h:column>
               <h:column>
               <f:facet="header">
               <h:outputText value="facilities">
               </f:facet>
               <rich:modalPanel id="panel" width="750" height="250">
               <f:facet name="controls">
               <h:panelGroup>
               <h:graphicImage value="/images/close.png" id="hidelink" />
               <rich:componentControl for="panel" attachTo="hidelink" operation="hide" event="onclick" />
               </h:panelGroup>
               </f:facet>
               <a4j:commandButton value="search" reRender="panel" action="#{popBean.search}" >
               <rich:componentControl for="panel" operation="show" disableDefault="true" event="onclick" />
               </a4j:commandButton>
              
               <%-------start of modal panel datatable---------%>
               <h:dataTable value="#{popBean.list}" var="list2" id="poplist" >
               <h:column>
               <f:facet name="header">
               <h:outputText value="Server ID"></h:outputText>
               </f:facet>
               <h:outputText value="#{list2.serverId}" />
               </h:column>
               <h:column>
               <f:facet name="header">
               <h:outputText value="Server Name"></h:outputText>
               </f:facet>
               <h:outputText value="#{list2.serverDescription}"/>
               </h:column>
               </h:dataTable>
               </rich:modalPanel>
               <h:outputLink id="link" value="#">
               <h:graphicImage value="/images/SEARCH.GIF" border="0">
               <rich:componentControl for="panel" attachTo="link" operation="show" event="onclick" />
               </h:outputLink>
               </h:column>
              <h:datatable>


              if i was you i wouldn't put a modalpanel on each row..., i would put only one modal panel outside the main datatable, it'll optimise the size of the page, and so the performance on client side...

              • 4. Re: problem in rich modal panel
                Kerdudou Ronan Apprentice

                i think you should never rerender the modalpanel... only its content... add a panelgroup inside and rerender the panelgroup...

                in your cas you can rerender "poplist" instead of "panel"...

                why opening a popup and then click on search, you can also call the search when opening the popup...
                or maybe you have search options in your code that you didn't post ?

                your code is quite strange...

                you can try something like that :

                <%-------start of basepage datatable------%>
                <h:datatable value="#{healthSystemBean.list}" var="list1">
                 <h:column>
                 <f:facet="header">
                 <h:outputText value="Name">
                 </f:facet>
                 <h:outputText value="#{list1.name}"/>
                 </h:column>
                 <h:column>
                 <f:facet="header">
                 <h:outputText value="facilities">
                 </f:facet>
                 <a4j:commandLink id="link" immediate="true" ajaxSingle="true" reRender="poplist" action="#{popBean.search}" oncomplete="Richfaces.showModalPanel('panel');">
                 <h:graphicImage value="/images/SEARCH.GIF" border="0">
                 </a4j:commandLink>
                 </h:column>
                <h:datatable>
                <rich:modalPanel id="panel" width="750" height="250">
                 <f:facet name="controls">
                 <h:panelGroup>
                 <h:graphicImage value="/images/close.png" id="hidelink" />
                 <rich:componentControl for="panel" attachTo="hidelink" operation="hide" event="onclick" />
                 </h:panelGroup>
                 </f:facet>
                 <%-------start of modal panel datatable---------%>
                 <h:dataTable value="#{popBean.list}" var="list2" id="poplist" >
                 <h:column>
                 <f:facet name="header">
                 <h:outputText value="Server ID"></h:outputText>
                 </f:facet>
                 <h:outputText value="#{list2.serverId}" />
                 </h:column>
                 <h:column>
                 <f:facet name="header">
                 <h:outputText value="Server Name"></h:outputText>
                 </f:facet>
                 <h:outputText value="#{list2.serverDescription}"/>
                 </h:column>
                 </h:dataTable>
                </rich:modalPanel>


                • 5. Re: problem in rich modal panel
                  kranthi kumar Newbie

                  Hi Ronan,

                  Thanks a lot.your code has worked.

                  I have missed the attribute
                  oncomplete="Richfaces.showModalPanel('panel');" for commandbutton.

                  Actually there are some input text boxes in the popup.Based on the inputs given the search should take place.thats why i hav kept search buton in the popup.

                  once again thanks a lot Ronan.

                  • 6. Re: problem in rich modal panel
                    kranthi kumar Newbie

                    Hi Ronan,

                    when i m using oncomplete="Richfaces.showModalPanel('panel') a new popup is opened with the updated datatable.
                    when i close this one,the old popup is still appearing.How to solve this problem??