JSF 模板：缺少布局答案

【问题标题】：JSF template: missing layoutJSF 模板：缺少布局
【发布时间】：2014-03-11 20:59:51
【问题描述】：

我对 JSF 很陌生，但在使用 JSF 模板时遇到了一些问题。模板 newTemplate.xhtml) 的代码如下所示：

<?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:ui="http://java.sun.com/jsf/facelets"
  xmlns:h="http://java.sun.com/jsf/html">

    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link href="./resources/css/default.css" rel="stylesheet" type="text/css" />
        <link href="./resources/css/cssLayout.css" rel="stylesheet" type="text/css" />
        <title><ui:insert name="title">Default title</ui:insert></title>
    </h:head>
    <h:body>
        <div id="top">
            <ui:insert name="top">Top</ui:insert>
        </div>
        <div>
            <div id="left">
                <ui:insert name="left">Left</ui:insert>
                <h:form>
                    <h:commandButton id="test" value="Test" action="/jsf/newTemplateClient.xhtml"/>
                </h:form>
            </div>
            <div id="content" class="left_content">
                <ui:insert name="content">Content</ui:insert>
            </div>
        </div>
        <div id="bottom">
            <ui:insert name="bottom">Bottom</ui:insert>
        </div>
    </h:body>
</html>

名为 index1.xhtml 的起始页如下所示：

<?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:ui="http://java.sun.com/jsf/facelets">

    <body>
        <ui:composition template="/WEB-INF/newTemplate.xhtml">
            <ui:define name="title">
                TEST
            </ui:define>
        </ui:composition>
    </body>
</html>

最终模板客户端页面（称为newTemplateClient.xhtml）：

<ui:composition template="/WEB-INF/newTemplate.xhtml"
            xmlns:ui="http://java.sun.com/jsf/facelets">
   <ui:define name="content">
        Some content in newTemplateClient.xhtml
   </ui:define>
</ui:composition>

这是应用程序的行为：

应用程序启动（地址栏显示localhost:8080/WebTEST/），布局和内容显示正常，
我点击'Test'按钮，newTemplateClient.xhtml的内容也正常显示（地址更改为：localhost:8080/WebTEST/faces/index1.xhtml），
我再次单击“测试”按钮并显示内容，但我失去了布局，因为没有应用 css 样式（没有颜色和格式）。现在地址栏显示：localhost:8080/WebTEST/faces/jsf/newTemplateClient.xhtml

模板文件位于WEB-INF文件夹，newTemplateClient.xhtml位于jsf文件夹。

我知道这可能是一些简单的事情，但我真的想不出这个问题的原因。

【问题讨论】：

问题是在您离开索引页面后，相对链接会解析为不同的绝对 URL。考虑使用<h:outputStylesheet library="css" value="default.css"> 而不是<link href=...>。
@DanielLyons 我添加了并且有效！非常感谢您的帮助！
太棒了！ :) 我已经回答了。如果你能接受，我将不胜感激。谢谢！

标签： jsf

【解决方案1】：

重复我的评论，问题在于 CSS 链接中的相对 URL 在您离开索引页面后会解析为不同的绝对 URL。但是，您可以使用一个不错的 JSF 标记来代替原始链接来解决您的问题：使用 <h:outputStylesheet library="css" value="default.css"> 而不是 <link href=...>。

【讨论】：