BinaryDevelop
  1. ホーム
  2. jsf

[解決済み】JSF 2.0 Faceletsを使用してXHTMLに別のXHTMLを含めるにはどうすればよいですか？

2022-04-05 13:29:36

質問

XHTMLのページの中に別のXHTMLのページを含めるには、どのような方法が最も正しいのでしょうか？いろいろな方法を試しているのですが、どれもうまくいきません。

解決方法は？

<ui:include>

最も基本的な方法は <ui:include> . 含まれるコンテンツは <ui:composition> .

マスターページのキックオフ例 /page.xhtml : 

<!DOCTYPE html>
<html lang="en"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <h:head>
        <title>Include demo</title>
    </h:head>
    <h:body>
        <h1>Master page</h1>
        <p>Master page blah blah lorem ipsum</p>
        <ui:include src="/WEB-INF/include.xhtml" />
    </h:body>
</html>

インクルードページ /WEB-INF/include.xhtml (そうです、これはファイル全体です。 <ui:composition> は不要で、Faceletsによって無視されます)。 

<ui:composition 
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <h2>Include page</h2>
    <p>Include page blah blah lorem ipsum</p>
</ui:composition>

によって開く必要があります。 /page.xhtml . を繰り返す必要がないことに注意してください。 <html> , <h:head> と <h:body> をインクルードファイルの中に入れてしまうことになります。 無効なHTML .

で動的なEL表現を使用することができます。 <ui:include src> . 以下もご参照ください。 ナビゲーションメニューの動的インクルードコンテンツをajax-refreshする方法は？(JSF SPA) .

<ui:define> / <ui:insert>

より高度なインクルード方法として テンプレート化 . これは基本的に他の方法を含みます。マスターテンプレートページは <ui:insert> は、定義されたテンプレート・コンテンツを挿入する場所を宣言するために使用します。マスターテンプレートページを利用するテンプレートクライアントページは、テンプレートコンテンツの挿入場所として <ui:define> を使用して、挿入されるテンプレートコンテンツを定義します。

マスターテンプレートページ /WEB-INF/template.xhtml (デザイン上のヒントとして、ヘッダー、メニュー、フッターは順番に <ui:include> ファイル）。 

<!DOCTYPE html>
<html lang="en"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <h:head>
        <title><ui:insert name="title">Default title</ui:insert></title>
    </h:head>
    <h:body>
        <div id="header">Header</div>
        <div id="menu">Menu</div>
        <div id="content"><ui:insert name="content">Default content</ui:insert></div>
        <div id="footer">Footer</div>
    </h:body>
</html>

テンプレートクライアントページ /page.xhtml (この template 属性があります。ここでも、これはファイル全体です)。 

<ui:composition template="/WEB-INF/template.xhtml"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets">

    <ui:define name="title">
        New page title here
    </ui:define>

    <ui:define name="content">
        <h1>New content here</h1>
        <p>Blah blah</p>
    </ui:define>
</ui:composition>

によって開く必要があります。 /page.xhtml . がない場合は <ui:define> の中のデフォルトのコンテンツが使用されます。 <ui:insert> があれば、代わりに表示されます。

<ui:param>

には、パラメータを渡すことができます。 <ui:include> または <ui:composition template> によって <ui:param> . 

<ui:include ...>
    <ui:param name="foo" value="#{bean.foo}" />
</ui:include>


<ui:composition template="...">
    <ui:param name="foo" value="#{bean.foo}" />
    ...
</ui:composition >

include/templateファイルの中では、以下のように利用できます。 #{foo} . もし、多くのパラメータを <ui:include> インクルードファイルをタグファイルとして登録し、最終的に以下のように使用できるようにすることを検討した方が良いでしょう。 <my:tagname foo="#{bean.foo}"> . 参照 ui:include>、タグファイル、コンポジットコンポーネント、カスタムコンポーネントはどのような場合に使用するのですか？

ビーン、メソッド、パラメータを丸ごと渡すこともできます。 <ui:param> . 以下もご参照ください。 JSF 2: Faceletsのサブビューに起動する引数を含むアクションを渡すには(ui:includeとui:paramを使用)？

デザインのヒント

URLを入力したり推測したりすることで一般に公開されることがないファイルは /WEB-INF フォルダーに保存されます。また どのXHTMLファイルを/WEB-INFに置いて、どのXHTMLファイルを置かないようにすればいいのですか？

の外には、マークアップ（HTMLコード）は必要ありません。 <ui:composition> と <ui:define> . 任意のものを置くことができますが、それらは 無視 をFaceletsで表示します。マークアップを入れるのは、ウェブデザイナーにとってのみ有効です。以下もご覧ください。 プロジェクト全体を構築せずに、JSFのページを実行する方法はありますか？

XHTMLファイルであるにもかかわらず、HTML5のdoctypeが最近推奨されています。XHTMLは、XMLベースのツールを使ってHTML出力を可能にする言語と見るべきでしょう。以下もご参照ください。 JSF+FaceletsをHTML4/5で使用することは可能ですか？ そして JavaServer Faces 2.2とHTML5対応、なぜまだXHTMLが使われているのか .

CSS/JS/image ファイルは、動的に再配置可能な/ローカライズされた/バージョン管理されたリソースとしてインクルードすることができます。以下も参照してください。 FaceletsのテンプレートでCSS/JS/画像リソースを参照するには？

Faceletsのファイルは、再利用可能なJARファイル内に置くことができます。以下もご参照ください。 複数のJSFプロジェクトでコードを共有するための構造体 .

高度な Facelets テンプレートに関する実際の例としては、次のようなものがあります。 src/main/webapp のフォルダに Java EE Kickoff Appのソースコード と OmniFacesショーケースサイトのソースコード .

関連

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します