3 Replies Latest reply on Jul 3, 2012 9:08 AM by ze_art

    Wrap rich:popupPanel as Composite Component not working

    beecom3000

      For RichFaces 4 M5, I try to wrap rich:popupPanel component as composite component so I can reuse the header control across the application. The code is shown below:

       

      <cc:interface>

          <cc:attribute name="header" required="true" />

          <cc:attribute name="width" default="550" />

          <cc:attribute name="height" default="550" />

      </cc:interface>

       

      <cc:implementation>

       

          <rich:popupPanel

              id="#{cc.clientId}"

              modal="false"

              resizable="true"

              autosized="true"

              width="#{cc.attrs.width}"

              height="#{cc.attrs.height}">

              <f:facet name="header">#{cc.attrs.header}</f:facet>

              <f:facet name="controls">

                  <h:outputLink

                      value="#"

                      onclick="onWindowMin(#{rich:component('#{cc.clientId}')}); return false;">

                      <h:graphicImage value="/images/window/win_minimize.png" id="toggleIcon"/>

                  </h:outputLink>

                  <h:outputLink

                      value="#"

                      onclick="#{rich:component('#{cc.clientId}')}.hide(); return false;">

                      <h:graphicImage value="/images/window/win_close.png" id="closeIcon"/>

                  </h:outputLink>

              </f:facet>

              <cc:insertChildren/>

          </rich:popupPanel>

       

      </cc:implementation>

      </body>

      </html>

       

      and then use it in one of the pages

       

                <h:inputText  id="targetChla" valueChangeListener="#{susLoadPlot.onTargetChlaChange}">

                      <a4j:ajax  event="keyup" execute="@this" render="targetSusLoad targetPercentReduction"/>

                      <rich:componentControl target="disclaimerDialog" operation="show" />

                </h:inputText>

       

              <widget:dialog id="disclaimerDialog" header="Disclaimer!">

                  <h:outputText escape="false" value="#{msg['module.disclaimer']}" />

              </widget:dialog>

       

      However, when I use the component, the following exception is thrown

       

      SEVERE: javax.faces.FacesException: Component ID discliamerDialog:j_id2 has already been found in the view.

       

      +id: discliamerDialog

               type: javax.faces.component.UINamingContainer@199f755

                +id: j_id2

                 type: javax.faces.component.UIPanel@1fdff07

                  +id: discliamerDialog

                   type: org.richfaces.component.UIPopupPanel@16e9494

                    +id: j_id2

                     type: javax.faces.component.UIPanel@724356

                      +id: j_idt71

       

      But if i don't define id inside the composite component, rich:componentControl does not work as it cannot find the exact match id

       

      Tried to use following instead but still not working

      <rich:componentControl target="#{rich:findComponent('disclaimerDialog*')}" operation="show" />

       

      Any solution to this?

        • 1. Wrap rich:popupPanel as Composite Component not working
          ilya_shaikovsky

          The exception is ok. your composit component in tree has the same id as inner one. Use something like "#{cc.attrs.id}modal}" and change component control accordingly.

          • 2. Re: Wrap rich:popupPanel as Composite Component not working
            beecom3000

            Ok, did that but syntax is wrong. Use something like this instead

                <rich:popupPanel id="#{cc.attrs.id}_modal"

                      ...

             

            Still have the same exception "Component ID disclaimerDialog:j_id2 has already been found in the view". I also have been trying different ways to get it to work for a day already without success. Maybe it's best to just copy-and-paste but not my preferred solution. Any suggestion?

            • 3. Re: Wrap rich:popupPanel as Composite Component not working
              ze_art

              Bit of a thread-necro, but i'm having the exact same issue using Mojarra 2.1.9 and RF 4.2.0.

               

              I found out what causes it, although i have no idea why RF/Mojarra is behaving that way.

               

              The issue is the code contained within the "controls" facet - if you put more than 1 direct child elements into that facet the descibed error will occur.

               

              <f:facet name="controls">

                          <h:outputLink

                              value="#"

                              onclick="onWindowMin(#{rich:component('#{cc.clientId}')}); return false;">

                              <h:graphicImage value="/images/window/win_minimize.png" id="toggleIcon"/>

                          </h:outputLink>

                          <h:outputLink

                              value="#"

                              onclick="#{rich:component('#{cc.clientId}')}.hide(); return false;">

                              <h:graphicImage value="/images/window/win_close.png" id="closeIcon"/>

                          </h:outputLink>

              </f:facet>

               

              The workaround i found is quite simple, wrap the 2 outputLink elements into a panelGroup, then it'll work just fine:

               

              <f:facet name="controls">

                   <h:panelGroup>

                          <h:outputLink

                              value="#"

                              onclick="onWindowMin(#{rich:component('#{cc.clientId}')}); return false;">

                              <h:graphicImage value="/images/window/win_minimize.png" id="toggleIcon"/>

                          </h:outputLink>

                          <h:outputLink

                              value="#"

                              onclick="#{rich:component('#{cc.clientId}')}.hide(); return false;">

                              <h:graphicImage value="/images/window/win_close.png" id="closeIcon"/>

                          </h:outputLink>

                   </h:panelGroup>

              </f:facet>