You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@myfaces.apache.org by Ed Dening <ed...@hotmail.com> on 2007/11/06 14:46:31 UTC
Trinidad Panel Popup - Unable to select items
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.
Re: Trinidad Panel Popup - Unable to select items
Posted by Ed Dening <ed...@hotmail.com>.
Using Trinidad 1.0.4 fixed this issue the earlier versions caused this
problem 1.0.2 / 1.0.3.
Ed Dening wrote:
>
> 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#a13795953
Sent from the MyFaces - Users mailing list archive at Nabble.com.