h:inputTextタグのようなテキスト入力フィールドには、基本的にはString型のデータが入ります。
コンバータとは、h:inputTextタグやh:outputTextタグなどValue Bindingが必要となるタグとManaged Beanのプロパティ間でデータ変換を行うものです。例えば、テキスト入力フィールドに入力された文字列をJavaのIntegerやDate型に変換します。また、IntegerやDate型のオブジェクトを、h:outputTextタグなどで画面上に出力します。
では、まずManaged Beanを見てみましょう。
import java.util.Date; public class ParameterBean { private Integer number = null; private Date date = null; public Integer getNumber() { return number; } public void setNumber(Integer n) { number = n; } public Date getDate() { return date; } public void setDate(Date d) { date = d; } }
このBeanを見ると、Integer型のnumberというプロパティと、Date型のdateというプロパティがあることがわかります。
次に、JSPの例です。
<%@ page contentType="text/html; charset=Shift_JIS" %> <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> <html> <head> <link href="style.css" type="text/css" rel="stylesheet" /> <title>JSF: コンバータのテスト</title> </head> <body> <h1>JSF: コンバータのテスト</h1> <f:view> <h:form id="searchForm"> <p> 整数を入力してください: <h:inputText id="number1" converter="javax.faces.Integer" value="#{ParameterBean.number}" /> <h:outputText id="number2" value="#{ParameterBean.number}" /> </p> <p> 日付を入力してください (例 04/08/09): <h:inputText id="date1" value="#{ParameterBean.date}"> <f:convertDateTime dateStyle="short" /> </h:inputText> <h:outputText id="date2" value="#{ParameterBean.date}"> <f:convertDateTime dateStyle="full" /> </h:outputText> </p> <p> <h:commandButton id="button1" value="Go!" /> </p> </h:form> </f:view> </body> </html>
このJSPを動かすと、図12.1[コンバータを利用した例]のようになります。
2つのテキストフィールドに入力したデータが、その横で出力されています。1つめのフィールドは、数字を入力しています。2つめのフィールドでは、"04/08/09"という入力を行っており、それに対応する出力が"2004年8月9日(月曜日)"となっています。
では、コンバータの使い方を見てみましょう。
整数を入力してください: <h:inputText id="number1" converter="javax.faces.Integer" value="#{ParameterBean.number}" /> <h:outputText id="number2" value="#{ParameterBean.number}" />
h:inputTextタグのところでコンバータが使われています。関係する属性を抜き出してみましょう。
converter="javax.faces.Integer" value="#{ParameterBean.number}"
ここでは、入力されたデータを、Integer型に変換するコンバータを指定しています。コンバートされたデータは、Integer型であるParameterBeanのnumberプロパティに保存します。
JSFでは、次のようなコンバータが標準で搭載されています。
このリストのうち、末尾に(*)という記号がついているものは、JSPでコンバータの記述をしなくても、自動的にコンバートが行われます。
従って、先のJSPは次のようにも記述できます。
整数を入力してください: <h:inputText id="number1" value="#{ParameterBean.number}" /> <h:outputText id="number2" value="#{ParameterBean.number}" />
こちらには、converter属性がありません。自動でInteger型にコンバートしてくれるのです。
次に、2つめのテキスト入力フィールドの部分です。
日付を入力してください (例 04/08/09): <h:inputText id="date1" value="#{ParameterBean.date}"> <f:convertDateTime dateStyle="short" /> </h:inputText> <h:outputText id="date2" value="#{ParameterBean.date}"> <f:convertDateTime dateStyle="full" /> </h:outputText>
h:inputText, h:outputTextのどちらにもf:convertDateTimeタグが利用されています。
まず、h:inputTextタグのところで、"04/08/09"のように入力された日付のデータを、JavaのDate型に変換しています。dateStyle属性では"short"という値が指定されています。この値によって、"04/08/09"といった書式が定められているのです。
<f:convertDateTime dateStyle="short" />
h:outputTextタグのところでは、"2004年8月9日(月曜日)"のように出力されます。この書式は、dateStyle属性の"full"という値によるものです。
<f:convertDateTime dateStyle="full" />
JSFでは、コンバータを自作することもできます。作成方法については、本講義では扱いません。
バリデータとは、入力されたデータが、そのアプリケーションに適合するものかどうかチェックする機能のことです。
具体的には、次のような機能になります。
バリデータに適合しなかった場合は、エラーメッセージを表示できます。
まず、JSPの例を見てみましょう。
<%@ page contentType="text/html; charset=Shift_JIS" %> <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> <html> <head> <link href="style.css" type="text/css" rel="stylesheet" /> <title>JSF: バリデータのテスト</title> </head> <body> <h1>JSF: バリデータのテスト</h1> <f:view> <h:form id="searchForm"> <p> お名前を入力してください(必須): <h:inputText id="name1" required="true" value="#{ParameterBean.name}" /> <br /> <h:message for="name1" /> <h:outputText id="number2" value="#{ParameterBean.name}" /> </p> <p> 電話番号を入力してください(10文字以上): <h:inputText id="tel1" value="#{ParameterBean.telephoneNumber}"> <f:validateLength minimum="10" /> </h:inputText> <br /> <h:message for="tel1" /> <h:outputText id="tel2" value="#{ParameterBean.telephoneNumber}" /> </p> <p> 品物の数を入力してください(1〜10): <h:inputText id="quantity1" value="#{ParameterBean.quantity}"> <f:validateLongRange minimum="1" maximum="10"/> </h:inputText> <br /> <h:message for="quantity1" /> <h:outputText id="quantity2" value="#{ParameterBean.quantity}" /> </p> <p> <h:commandButton id="button1" value="Go!" /> </p> </h:form> </f:view> </body> </html>
このJSPを動かすと、図12.2[バリデータを利用した例]のように動作します。
また、バリデータに適合しなかった場合は、図12.3[バリデータに適合しなかった例]のように動作します。
JSFでは、次のようなバリデータが標準で搭載されています。
また、必須項目のチェックもできます。
それでは、それぞれのバリデータについて見てみましょう。
では、まず「必須項目のチェック」からです。
お名前を入力してください(必須): <h:inputText id="name1" required="true" value="#{ParameterBean.name}" /> <br /> <h:message for="name1" />
h:inputTextタグに次の属性があります。
required="true"
このrequired属性がtrueになっていると、このh:inputTextは必須項目となります。データが入力されていないとエラーになります。
h:inputTextタグのすぐ下に、h:messageというタグがあります。
<h:message for="name1" />
h:messageタグは、エラーメッセージを表示するUIコンポーネントです。for属性で指定したUIコンポーネントに関するエラーメッセージを表示します。
ここでは、for属性の"name1"という値は、すぐ上のh:inputTextタグのid属性の値と一致しています。ということは、このh:messageタグは、すぐ上のh:inputTextタグに関するエラーメッセージになるということです。
次に、入力された文字列の長さをチェックするバリデータです。
電話番号を入力してください(10文字以上): <h:inputText id="tel1" value="#{ParameterBean.telephoneNumber}"> <f:validateLength minimum="10" /> </h:inputText> <br /> <h:message for="tel1" />
f:validateLengthというタグは、文字列の長さをチェックするバリデータです。ここでは、入力される文字列は、最小でも10文字以上になることを指定しています。
図12.2[バリデータを利用した例]と図12.3[バリデータに適合しなかった例]を見比べてみてください。
ほかに、maximum属性もあります。最大で何文字までかチェックします。
<f:validateLength minimum="10" />
最後に、数の範囲をチェックするバリデータです。
品物の数を入力してください(1〜10): <h:inputText id="quantity1" value="#{ParameterBean.quantity}"> <f:validateLongRange minimum="1" maximum="10"/> </h:inputText> <br /> <h:message for="quantity1" />
f:validateLongRangeというタグは、整数の数の範囲をチェックするバリデータです。この例では、入力される数は1〜10までの範囲となります。それ以外だとエラーになるのです。
図12.2[バリデータを利用した例]と図12.3[バリデータに適合しなかった例]を見比べてみてください。
<f:validateLongRange minimum="1" maximum="10"/>
JSFでは、コンバータと同じく、バリデータを自作することもできます。作成方法については、本講義では扱いません。