2 Replies Latest reply on Jun 25, 2012 7:36 AM by Karsten Wutzke

    rich:popupPanel breaks subsequent text to next line

    Karsten Wutzke Expert

      Hello,

       

      I have the following panelGroup (in a Facelets sub view):

       

      {code:xml}  <h:panelGroup id="#{panelId}">

          <h:inputText value="#{fileName}"

                       disabled="true"

                       readonly="true"/>

          <h:outputText value=" " />

          <ui:include src="/subviews/preview-link.xhtml">

          </ui:include>

          <h:outputText value=" " />

          <ui:include src="/subviews/image-link-confirm-popup.xhtml">

            <ui:param name="linkImageFileName" value="cross.png" />

            ...

          </ui:include>

          <h:outputText value=" 72 KB" rendered="#{not empty fileName}" />

        </h:panelGroup>{code}

      The relevant nested Facelets sub view image-link-confirm-popup.xhtml is:

       

      {code:xml}  <h:panelGroup rendered="#{panelRendered}">

          <h:commandLink>

            <h:graphicImage library="images/icons" name="#{linkImageFileName}"  />

            <rich:componentControl target="#{popupId}" operation="show" />

          </h:commandLink>

          <ui:include src="/subviews/confirm-popup.xhtml">

            <!-- popup params implicitly available from caller -->

          </ui:include>

        </h:panelGroup>{code}

      The confirm-popup.xhtml just is a single popup:

       

      {code:xml}  <rich:popupPanel modal="true"

                         ...

        </rich:popupPanel>{code}

      Problem:

       

      When placing an outputText after the image-link-confirm-popup.xhtml (h:commandLink + rich:popupPanel) the outputText appears in the next line, as if a new block is rendered.

       

      It looks like this:

      rf-popup-newline.png

      Why in the world is this happening?

       

      I inspected the generated code for the popup:

       

      {code:xml}     ...

           <div class="rf-pp-hndlr rf-pp-hndlr-br" id="j_idt18:tendering-remove-popupResizerSE">

           </div>

          </div>

          <script type="text/javascript">new RichFaces.ui.PopupPanel("j_idt18:tendering\u002Dremove\u002Dpopup",{"height":160,"resizeable":true} );</script>

         </div> <!-- cause? -->

        </span>

        <span> 72 KB</span>

      </span>

      </td>{code}

      Is the div the cause for this? Or the divs? Is there a way to fix this?

       

      Karsten

       

      PS: Note, that because the popupPanel is part of a reusable image link, it is not possible to put the popup anywhere else but where it currently is.