Question

我遇到了关于素面布局的问题。我的南部layoutUnit没有出现在页面中。我不知道为什么。这是我的页面代码：

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.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:p="http://primefaces.org/ui">

    <f:view contentType="text/html" >
        <h:head>
            <f:facet name="first">
                <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
                <h:outputStylesheet name="./css/default.css"/>
                <h:outputStylesheet name="./css/cssLayout.css"/>
                <title>PrimeFaces</title>
            </f:facet>

        </h:head>
        <h:body >
            <p:layout   >
                <p:layoutUnit position="north"  >
                    <h:form  >
                        <img src="resources/images/logo.png" alt="" />&nbsp;&nbsp;&nbsp;
                        <p:outputLabel value="Rechercher    " style="font-size: large"/>  &nbsp;&nbsp;&nbsp;
                        <p:inputText  value="#{acount.livre.titre}" required="true" styleClass="search"/>&nbsp;&nbsp;&nbsp;
                        <p:commandButton value="Go" action="#{acount.rechercherLivre(acount.livre.titre)}"  styleClass="btngo"  />
                        <h:link outcome="main.xhtml" value="Accueil"   style="margin-left: 400px;font-size: medium"/>&nbsp;&nbsp;
                        <h:link outcome="Contact.xhtml"  value="Contact" style="font-size: medium"/>&nbsp;&nbsp;
                        <h:link outcome="Info.xhtml" value="Info" style="font-size: medium"/>&nbsp;&nbsp;&nbsp;
                        <h:link outcome="Login.xhtml" value="Login" style="font-size: medium" rendered="#{!acount.connected}" /> &nbsp;&nbsp;
                        <h:link outcome="exe.xhtml" value="S'enregistrer" style="font-size: medium" rendered="#{!acount.connected}" /> &nbsp;&nbsp;
                        <p:menuButton value="Panier #{shopingCart.produits.size()}"   style="color: #045491;background: greenyellow;background-color: yellowgreen;font-size: medium">
                            <p:menuitem value="Afficher"    action="#{shopingCart.afficherPanier()}"/>
                            <p:separator />
                            <p:menuitem value="Homepage" url="http://www.primefaces.org" />
                        </p:menuButton>
                        <p:menuButton value="Options"   rendered="#{acount.connected}" style="color: #045491;background: greenyellow;background-color: yellowgreen;font-size: medium">
                            <p:menuitem value="Compte"   />
                            <p:menuitem value="Mes Commandes "  />
                            <p:menuitem value="Se deconnecter" action="#{acount.doLogout()}"  />
                            <p:separator />
                            <p:menuitem value="Homepage" url="http://www.primefaces.org" />
                        </p:menuButton>
                    </h:form>
                </p:layoutUnit>
                <p:layoutUnit position="west"   collapsible="true"  style="color: #ccc;padding-left: 50px;border-right-color: yellowgreen;border-left: none;border-bottom: none;border-top-color: yellowgreen"  >
                    <h:link  value="Art " styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="Biographies" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="Business" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="children books" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="comic" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="Entertainement" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="Medecine" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="Sport" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="Science" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="Informatique" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="Romance" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="ArtPhotographi" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="BiographiesMemoirs" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="Businessinvesting" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="childrenbooks" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="comic" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="entertainement" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="medecine" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="sport" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="science" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="travels" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <h:link  value="romance" styleClass="link">
                        <f:param name="productId" value="10" />
                    </h:link><br/>
                    <img src="resources/images/payment_methods.png" style="padding-top: 50px;"/>
                </p:layoutUnit>

                <p:layoutUnit position="center" resizable="true" closable="true" collapsible="true"  style="padding-left: 100px;padding-bottom: auto;border: none"  >
                    <ui:insert name="content"  >  </ui:insert>
                </p:layoutUnit>

                <p:layoutUnit position="south" style="border-color: yellowgreen">
                    <h1>
                        we don't see this layout in the page
                    </h1>
                </p:layoutUnit>
            </p:layout>

        </h:body>
    </f:view>
</html>

，导航器中的页面如下所示

enter image description here

如何解决它，任何帮助都会对我好，非常感谢

Answer 1

遵循VeenarM建议的链接：

为您设置<p:layout fullPage="true">选项吗？ Primefaces显然必须知道布局的高度，以便将南部组件粘贴到页面底部。

Primefaces south layoutUnit问题

1 个答案: