Sandro
Sandro

Reputation: 1276

PopupPanel containing pickList changing position after reopening

I have a pickList inside a popupPanel. If I open the popupPanel, it appears in the middle of the window. If I close and reopen it, it appears shifted to the left and to the bottom. This only happens when I have the pickList inside the popupPanel. If I remove it everything works as expected.

Below I have a snippet that reproduces the problem. I am using RichFaces 4.1, the problem is reproducable on IE, Chrome and Firefox (others not tested).

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:rich="http://richfaces.org/rich" 
      xmlns:fn="http://java.sun.com/jsp/jstl/functions">

    <h:head></h:head>
    <h:body>
        <rich:popupPanel domElementAttachment="parent" id="popup" autosized="true" modal="true">
            <h:commandButton value="Close" onclick="#{rich:component('popup')}.hide();" />
            <rich:pickList>
                <f:selectItems value="#{fn:split('Test,TestTest,TestTestTest', ',')}" />
            </rich:pickList>
        </rich:popupPanel>
        <h:commandButton value="Panel" onclick="#{rich:component('popup')}.show();" />
    </h:body>
</html>

Upvotes: 0

Views: 856

Answers (2)

leonardo12
leonardo12

Reputation: 398

The cause is Richfaces bug 11736. Known workarounds are:

  1. Sandros: changing domElementAttachment from parent to body.
  2. calling a Javascript function before showing the panel:

    onbeforeshow="fixPositioning('#{rich:clientId('popupPanelId')}');"
    

    with function definied like:

    function fixPositioning(panelId) {
        var popupPanel = document.getElementById(panelId);
        if (popupPanel) {
            popupPanel.style.visibility = "hidden";
            popupPanel.style.display = "block";
        }
    }
    

    This solution was described there

Upvotes: 1

Sandro
Sandro

Reputation: 1276

Without understanding why, I could fix the problem in this case by changing domElementAttachment="parent" to domElementAttachment="body". If the popup is defined inside a form body can be replaced by form.

I really have no idea why this works and would be very interested in an explanation.

Upvotes: 2

Related Questions