JSFによるWebアプリケーション開発 第9回

Presentation on theme: "JSFによるWebアプリケーション開発 第9回"— Presentation transcript:

1 JSFによるWebアプリケーション開発 第9回
イベント処理 JSFによるWebアプリケーション開発 第9回

2 ここでの内容 JSFのイベント処理について学ぶ。

3 イベント処理とは イベント ＝ アプリケーションで行われる操作 イベント処理とは、ある特定のイベントが起こったときに、何らかの処理を行うこと
イベント　＝　アプリケーションで行われる操作 ボタンを押する 入力フィールドにデータを入力する イベント処理とは、ある特定のイベントが起こったときに、何らかの処理を行うこと

4 イベント処理のしくみ イベント発生元 イベントリスナー イベントが起こるところ ボタン、テキストフィールドなど
発生したイベントを受け取り、イベントに対応する処理を行うところ

5 JSFでの２種類のイベント処理 Action イベント Value Change イベント
ボタンやハイパーリンクが押されたときに発生するイベント Value Change イベント ボタンが押されたとき、対象となるUIコンポーネントが変化していたら発生するイベント

6 Action イベント

7 やりたいこと (1)

8 やりたいこと (2) 「名前」を入力してボタンを押すと、次の２つの情報を出力する。 入力された「名前」 どのボタンが押されたか

9 JSPの記述 <h:inputText id="word“ value="#{ParameterBean.name}" />
<h:commandButton id="button1" value="Button1" actionListener= "#{ParameterBean.assembleMessage}" /> <h:commandButton id="button2" value="Button2" <h:outputText id="message" value="#{ParameterBean.message}" />

10 イベントリスナーの設定 <h:commandButton id="button1" value="Button1"
actionListener= "#{ParameterBean.assembleMessage}" /> actionListener 属性の値は Method Binding 式となっている。 ParameterBean の assembleMessage メソッドがイベントリスナーとなる。

11 イベントリスナーの実装 public void assembleMessage(ActionEvent event) {
String id = event.getComponent().getId(); StringBuffer sb = new StringBuffer(); sb.append(name); sb.append("さん、"); sb.append(id); sb.append("が押されました。"); message = new String(sb); }

12 イベントリスナーのルール public void assembleMessage(ActionEvent event) { ……… }
返値はなし

13 ActionEvent オブジェクトの操作
String id = event.getComponent().getId(); イベントが起こったUIコンポーネントの id 属性の値を返す。

14 Action Method と Action Event
outcome が便利 ActionEvent オブジェクトを利用することで、イベント発生元のUIコンポーネントの情報を取得できる。

15 Value Change イベント

16 やりたいこと (1) “Go!”ボタンが押されたとき、ラジオボタンの選択内容が変化していたらメッセージを表示する

17 やりたいこと (2) “Go!”ボタンが押されても、ラジオボタンの選択内容が変化していなかったらメッセージも変わらない。

18 JSPの記述 <h:selectOneRadio value="#{ParameterBean.sports}"
valueChangeListener= "#{ParameterBean.assembleMessage}"> ……… </h:selectOneRadio> <h:commandButton id="button" value="Go!" /> <h:outputText id="message" value="#{ParameterBean.message}" />

19 h:selectOneRadio 要素 (1)
value="#{ParameterBean.sports}" valueChangeListener= "#{ParameterBean.assembleMessage}"> <f:selectItem itemValue="baseball“ itemLabel="野球" /> <f:selectItem itemValue="soccer“ itemLabel="サッカー" /> </h:selectOneRadio>

20 h:selectOneRadio 要素 (2)
ラジオボタンを表す UIコンポーネント ラジオボタンは、１つだけ選択ができるボタンのグループ 選択されたボタンの値は value 属性で Value Binding を使う <h:selectOneRadio value="#{ParameterBean.sports}“> </h:selectOneRadio>

21 f:selectItem 要素 <f:selectItem itemValue="baseball“
itemLabel="野球" /> １つの選択肢を表すUIコンポーネント itemValue 属性は、この選択肢が選ばれたときにh:selectOneRadio 要素の value 属性に入る値 itemLabel 属性は、表示される文字列

22 イベントリスナーの設定 <h:selectOneRadio value="#{ParameterBean.sports}"
valueChangeListener= 　 "#{ParameterBean.assembleMessage}"> </h:selectOneRadio> valueChangeListener 属性の値は Method Binding 式となっている。 ParameterBean の assembleMessage メソッドがイベントリスナーとなる。

23 イベントリスナーの実装 public void assembleMessage( ValueChangeEvent event) {
String str = event.getNewValue().toString(); ...... if (str.equals("baseball")) { sb.append("野球"); } message = new String(sb);

24 イベントリスナーのルール public void assembleMessage( ValueChangeEvent event) {
返値はなし

25 ActionEvent オブジェクトの操作
String str = event.getNewValue().toString(); イベントが起こったUIコンポーネントの現在の値を返す。