Jsf-custom-tag

提供:Dev Guides
移動先:案内検索

JSF-カスタムタグ

JSFは、カスタムコンテンツをレンダリングするために使用できる独自のカスタムタグを定義する強力な機能を開発者に提供します。

JSFでのカスタムタグの定義は、3ステップのプロセスです。

Step Description
1a Create a xhtml file and define contents in it using *ui:composition *tag
1b Create a tag library descriptor (.taglib.xml file) and declares the above custom tag in it.
1c Register the tag libray descriptor in web.xml

ステップ1a:カスタムタグコ​​ンテンツの定義:buttonPanel.xhtml

<h:body>
   <ui:composition>
      <h:commandButton type = "submit" value = "#{okLabel}"/>
      <h:commandButton type = "reset" value = "#{cancelLabel}"/>
   </ui:composition>
</h:body>

ステップ1b:タグライブラリを定義する:finddevguides.taglib.xml

名前が示すように、タグライブラリはタグのライブラリです。 次の表に、タグライブラリの重要な属性を示します。

S.No Node & Description
1
  • facelet-taglib*

すべてのタグが含まれます。

2

namespace

タグライブラリの名前空間。一意である必要があります。

3

tag

単一のタグが含まれています

4

tag-name

タグの名前

5

source

タグの実装

=

<facelet-taglib>
   <namespace>http://finddevguides.com/facelets</namespace>
   <tag>
      <tag-name>buttonPanel</tag-name>
      <source>com/finddevguides/buttonPanel.xhtml</source>
   </tag>
</facelet-taglib>

手順1c:タグライブラリ:web.xmlを登録する

<context-param>
   <param-name>javax.faces.FACELETS_LIBRARIES</param-name>
   <param-value>/WEB-INF/finddevguides.taglib.xml</param-value>
</context-param>

JSFでのカスタムタグの使用は、2段階のプロセスです。

Step Description
2a Create a xhtml file and use custom tag library’s namespace
2b Use the custom tag as normal JSF tags

ステップ2a:カスタム名前空間を使用:home.xhtml

<html xmlns = "http://www.w3.org/1999/xhtml"
   xmlns:h = "http://java.sun.com/jsf/html"
   xmlns:ui = "http://java.sun.com/jsf/facelets">
   xmlns:tp = "http://finddevguides.com/facelets">

ステップ2b:カスタムタグの使用:home.xhtml

<h:body>
   <tp:buttonPanel okLabel = "Ok" cancelLabel = "Cancel"/>
</h:body>

応用例

テストJSFアプリケーションを作成して、JSFのテンプレートタグをテストしましょう。

Step Description
1 Create a project with a name helloworld under a package com.finddevguides.test as explained in the JSF - First Application chapter.
2 Create com folder under WEB-INF directory.
3 Create finddevguides folder under WEB-INF > com directory.
4 Create buttonPanel.xhtml file under WEB-INF > com > finddevguides folder. Modify it as explained below.
5 Create finddevguides.taglib.xml file under WEB-INF folder. Modify it as explained below.
6 Modify web.xml file under WEB-INF folder as explained below.
7 Modify home.xhtml as explained below. Keep rest of the files unchanged.
8 Compile and run the application to make sure business logic is working as per the requirements.
9 Finally, build the application in the form of war file and deploy it in Apache Tomcat Webserver.
10 Launch your web application using appropriate URL as explained below in the last step.

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

   <h:body>
      <ui:composition>
         <h:commandButton type = "submit" value = "#{okLabel}"/>
         <h:commandButton type = "reset" value = "#{cancelLabel}"/>
      </ui:composition>
   </h:body>
</html>

finddevguides.taglib.xml

<?xml version = "1.0"?>
<!DOCTYPE facelet-taglib PUBLIC
"-//Sun Microsystems, Inc.//DTD Facelet Taglib 1.0//EN"
"http://java.sun.com/dtd/facelet-taglib_1_0.dtd">

<facelet-taglib>
   <namespace>http://finddevguides.com/facelets</namespace>

   <tag>
      <tag-name>buttonPanel</tag-name>
      <source>com/finddevguides/buttonPanel.xhtml</source>
   </tag>
</facelet-taglib>

web.xml

<!DOCTYPE web-app PUBLIC
"-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd" >

<web-app>
   <display-name>Archetype Created Web Application</display-name>
   <context-param>
      <param-name>javax.faces.PROJECT_STAGE</param-name>
      <param-value>Development</param-value>
   </context-param>

   <context-param>
      <param-name>javax.faces.FACELETS_LIBRARIES</param-name>
      <param-value>/WEB-INF/finddevguides.taglib.xml</param-value>
   </context-param>

   <servlet>
      <servlet-name>Faces Servlet</servlet-name>
      <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
   </servlet>

   <servlet-mapping>
      <servlet-name>Faces Servlet</servlet-name>
      <url-pattern>*.jsf</url-pattern>
   </servlet-mapping>
</web-app>

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

   <h:head>
      <title>JSF tutorial</title>
   </h:head>

   <h:body>
      <h1>Custom Tags Example</h1>
      <tp:buttonPanel okLabel = "Ok" cancelLabel = "Cancel"/>
   </h:body>
</html>

すべての変更を完了したら、JSF-最初のアプリケーションの章で行ったようにアプリケーションをコンパイルして実行します。 すべてがアプリケーションで問題ない場合、次の結果が生成されます。

JSFカスタムタグ