I am having a problem using the panel popup, as I'm unable to select items
from the popup. On the page I have 2 div's header and content. When I try
and add the panel popup in the header the popup is in the correct position
but no items can be selected. 

I believe the issue is to do with the css for the header and content. The
header has a z-index of 5 with the position absolute and the content has a
z-index of 3 with a position of absolute. When I remove the position is
absolute from the header and content, I can select the items from the popup,
but the positioning of the header and content is incorrect. Does anyone have
any suggestions? 

Ed

header and footer css

#header {
        background-color: white;
        background-image:
                
url(/xAdvisorWeb/bundles/fdicommon/skins/FDI/images/bannergradient.gif)
                ;
        background-repeat: repeat-x;
        font-size: 1em;
        color: #0c479d;
        position: absolute;
        top: 0;
        width: 100%;
        height: 3em;
        z-index: 5;
        padding-left: 3px;
        padding-right: 3px;
}

#content {
        display: block;
        overflow: auto;
        position: absolute;
        z-index: 3;
        top: 0;
        bottom: 0;
        height: 100%;
        width: 100%;
        border-top: 3em solid #fff;
        border-bottom: 2em solid #fff;
        padding-left: 3px;
        padding-top: 5px;
        padding-right: 3px;
}

<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"; version="2.0"
        xmlns:ui="http://java.sun.com/jsf/facelets";
        xmlns:f="http://java.sun.com/jsf/core";
        xmlns:tr="http://myfaces.apache.org/trinidad";
        xmlns:trh="http://myfaces.apache.org/trinidad/html";>
        
        <ui:composition>
                <html>
                        <trh:head>
                                <script language="JavaScript">
                                        function openWindow(url)
                                        {
                                                
window.open(url,'popupWindow',config='height=500,width=600');
                                        }
                        
                                </script>
                        </trh:head>
                        <trh:body>
                                <div id="header">
                                        <tr:panelPopup> 
                                                <f:facet name="trigger">
                                                        <tr:panelGroupLayout>
                                                                <tr:icon 
name="required" />
                                                        </tr:panelGroupLayout>
                                                </f:facet>
                                                <tr:panelBox>
                                                        <tr:commandButton 
inlineStyle="width:100%"
onclick="openWindow('http://www.hotmail.com')" text="Hotmail" />
                                                        <tr:commandButton 
inlineStyle="width:100%"
onclick="openWindow('http://www.msn.com')" text="MSN" />
                                                        <tr:commandButton 
inlineStyle="width:100%"
onclick="openWindow('http://www.google.com')" text="Google" />
                                                </tr:panelBox>
                                        </tr:panelPopup>
                                </div>
                                                
                                <div id="content">
                                </div>
                        </trh:body>
                </html>
        </ui:composition>

-- 
View this message in context: 
http://www.nabble.com/Trinidad-Panel-Popup---Unable-to-select-items-tf4758149.html#a13606866
Sent from the MyFaces - Users mailing list archive at Nabble.com.

Reply via email to