0

我在 jsf 文件上有 primeface p:panel。我在模板页面 (anasayfa.xhtml) 上应用以下样式的背景颜色。

<h:head>
    <style type="text/css">
.bos{background-color:red;}
</style>
</h:head>

我的带有 viewscoped 支持 bean 的 Jsf 页面：

<ui:composition template="/anasayfa.xhtml">
    <ui:define name="ortaAlan">
...

<p:panel styleClass="bos">
...
</p:panel>


</ui:define>
</ui:composition>

当我加载页面时，很快就会看到背景颜色，然后变得透明。CTRL+F5 具有相同的效果。

这里有什么问题？提前感谢您的帮助

面板的选择器和计算样式

jsf页面：

<!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:p="http://primefaces.org/ui"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets">

<ui:composition template="/anasayfa.xhtml">
    <ui:define name="ortaAlan">
    <p:panel id="rezerveleriniz">
            <h:outputText value="#{rezervasyonBean.bugun.time}">
                <f:convertDateTime pattern="dd/MM/yyyy" />
            </h:outputText> : Rezervasyon Saatleri <br/>


    <ui:repeat var="r" value="#{rezervasyonBean.kullaniciRezervasyonSaatleri}">
    #{r.saatAraligi}<br/>
    </ui:repeat>

    </p:panel>

        <h:form id="aaa">


<p:panel>
<p:panel style="float:left;">
            <h:panelGrid columns="1">
            <ui:repeat var="rs" value="#{rezervasyonBean.rezervasyonSaatleriListesi}">

**// !!!!!!!!!!!! Problem is here !!!!!!!!**

                <p:panel styleClass="#{rezervasyonBean.isRezervasyonOnThisDay(rs) ? 'dolu' : 'bos' }">
                    #{rs.saatAraligi}
                    <h:commandButton action="#{rezervasyonBean.sec(rs,'1')}" value="+" update=":rezerveleriniz" disabled="#{rezervasyonBean.isRezervasyonOnThisDay(rs)}" />
                </p:panel>
            </ui:repeat>
            </h:panelGrid>

            <h:commandButton action="#{rezervasyonBean.kaydet()}" value="Kaydet" />
</p:panel>

<div style="clear:both;"></div>
</p:panel>
        </h:form>
    </ui:define>
</ui:composition>
</html>

模板：

<!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:p="http://primefaces.org/ui"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>
    <title>Görev Takip Sistemi</title>
    <style type="text/css">
        .ui-widget,.ui-widget .ui-widget {
            font-size: 12px !important;
            font-family:Arial;
        }

.bos{
background-color:red;
}
.dolu{
background-color:yellow;
}

        #topPanel {z-index:2 !important; }
        #topPanel div{overflow:visible;}

        .colStyle_panelGridForGorev{
            width:225px;
        }
        .colStyle_panelGridForProfil{
            width:100px;
        }
    </style>

</h:head>
<body>  


    <p:growl for="growlForAnasayfa" showDetail="true" life="3000" autoUpdate="true"/>

    <h:form>
        <p:idleMonitor timeout="900000">  
            <p:ajax event="idle" listener="#{anasayfaBean.indirectLogout}"/>  
        </p:idleMonitor>  
    </h:form>

    <p:ajaxStatus onstart="statusDialog.show();" onsuccess="statusDialog.hide();" />  

    <p:dialog modal="true" widgetVar="statusDialog" header="Status"   
            draggable="false" closable="false">  
        <p:graphicImage value="/images/statusBar.gif" />  
    </p:dialog> 

    <p:layout fullPage="true">

        <p:layoutUnit position="north" size="50"  id="topPanel" style="border:0px">
            <h:form id="formAnaSayfaToolbar">
                <p:toolbar>
                    <p:toolbarGroup align="left">
                        <p:commandButton type="submit" value="#{anasayfaBean.kullanici.kullaniciAdi} #{anasayfaBean.kullanici.kullaniciSoyadi}" 
                            style="margin-left:200px;" action="/profil.xhtml?faces-redirect=true" ajax="false"/>
                        <p:commandButton type="submit" value="Gruplarım" 
                            action="/kullanici/gruplarim.xhtml?faces-redirect=true" ajax="false" rendered="#{!anasayfaBean.daireBaskani}"/>
                        <p:commandButton type="submit" value="Görevlerim" 
                            action="/gorevListele.xhtml?faces-redirect=true" ajax="false" rendered="#{!anasayfaBean.daireBaskani}"/>

                        <p:commandButton type="submit" value="Kullanıcı İşlemleri" 
                            action="/daireBaskani/kullanici.xhtml?faces-redirect=true" ajax="false" rendered="#{anasayfaBean.daireBaskani}"/>
                        <p:commandButton type="submit" value="Grup İşlemleri" 
                            action="/daireBaskani/grup.xhtml?faces-redirect=true" ajax="false" rendered="#{anasayfaBean.daireBaskani}"/>

                        <p:menuButton value="Görev İşlemleri" rendered="#{anasayfaBean.daireBaskani}">
                            <p:menuitem value="Yeni Görev Ekle" url="/daireBaskani/gorevEkle.btk" />  
                            <p:menuitem value="Gorevleri Listele" url="/gorevListele.btk" />  
                        </p:menuButton>

                        <p:menuButton value="Admin Paneli" rendered="#{anasayfaBean.admin}"> 
                            <p:menuitem value="Birim İşlemleri" url="/admin/birim.btk" />  
                            <p:menuitem value="Ünvan İşlemleri" url="/admin/unvan.btk" />  
                        </p:menuButton>

                    </p:toolbarGroup>
                    <p:toolbarGroup align="right">
                        <p:commandButton type="submit" value="Çıkış" icon="ui-icon-close" 
                            action="#{anasayfaBean.logout}" ajax="false"  style="margin-right:200px;"/>
                    </p:toolbarGroup>
                </p:toolbar> 
            </h:form>
        </p:layoutUnit>

        <p:layoutUnit position="center">
            <ui:insert name="ortaAlan">
                <h:outputText value="Yukarıdaki menüden yapmak istediğiniz işlemi seçiniz." />
            </ui:insert>
        </p:layoutUnit>

        <p:layoutUnit position="south" size="30" resizable="true" style="border-width:0px;">
            <h:form style="text-align:center; font-size:13px;">
                <h:outputText value="Bilişim Sistemleri Dairesi © 2012" />
            </h:form>
        </p:layoutUnit>

        <p:layoutUnit position="east" size="200"  id="eastPanel" style="border:0px">
        </p:layoutUnit>
        <p:layoutUnit position="west" size="200"  id="westPanel" style="border:0px">
        </p:layoutUnit>

    </p:layout>

</body>
</html>
4

0 回答 0