JSF2.2(JavaServer Faces)学習記 HTML5への対応

2015/5/27 2015/7/28 Java, JSF

GlassFishを使ってJSFの学習をしています。前回は基本的な入出力タグの利用方法を学習しましたがJSF2.2からHTML5への対応が強化されているとのことで調査しました。

環境

Java 1.8.0_40
GlassFish4.1
JSF2.2

パススルーアトリビュートとは

JSF2.2では小さくも効果のあるアップデートがあったようです。その１つが「パススルーアトリビュート（又はパススルー属性）」です。

なぜJSF2.2でパススルーアトリビュートが必要になったかといえばHTML5への対応のためです。

HTML5では様々な属性が追加されました。また今後も追加されていくことでしょう。属性が追加されるたびにJSFタグの見直しをしていたらとても大変です。そこでパススルーアトリビュートを利用することでHTML側の変更に強い仕様にしたという背景があります。

そもそもパススルーとはおそらくネットワーク用語から来ていると思うのですが、

受信したものを変えずにそのまま伝送する方式

です。

サンプルソースを見てもらえば分かるとおり、入力された値をそのままHTMLに変換しているのでパススルーなのです。

サンプルソース

ポイントは

「xmlns:p=”http://xmlns.jcp.org/jsf/passthrough」を宣言
「p:属性名=XXXX」として利用


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://xmlns.jcp.org/jsf/passthrough">
<h:head>
<title>JSF HTML5</title>
</h:head>
<h:body>
<h:form>

<table>
<tr>
<td>プレースホルダ</td>
<td><h:inputText p:placeholder="hello" /></td>
</tr>

<tr>
<td>オートフォーカス</td>
<td><h:inputText p:autofocus="true" /></td>
</tr>

<tr>
<td>E-Mail</td>
<td><h:inputText p:type="email" /></td>
</tr>

<tr>
<td>範囲指定</td>
<td><h:inputText p:type="range" /></td>
</tr>

<tr>
<td>数値入力</td>
<td><h:inputText p:type="number" p:step="1" /></td>
</tr>

</table>

<h:commandButton value="ボタン" />
</h:form>
</h:body>
</html>

以上