イベント処理 JSFによるWebアプリケーション開発 第9回 1 ここでの内容 JSFのイベント処理について学ぶ。 2 イベント処理とは イベント = アプリケーションで行われる 操作 ボタンを押する 入力フィールドにデータを入力する イベント処理とは、ある特定のイベントが起 こったときに、何らかの処理を行うこと 3 イベント処理のしくみ イベント発生元 イベントが起こるところ ボタン、テキストフィールドなど イベントリスナー 発生したイベントを受け取り、イベントに対応 する処理を行うところ 4 JSFでの2種類のイベント処理 Action イベント ボタンやハイパーリンクが押されたときに発生 するイベント Value Change イベント ボタンが押されたとき、対象となるUIコンポー ネントが変化していたら発生するイベント 5 Action イベント 6 やりたいこと (1) 7 やりたいこと (2) 「名前」を入力してボタンを押すと、次の2 つの情報を出力する。 入力された「名前」 どのボタンが押されたか 8 JSPの記述 <h:inputText id="word“ value="#{ParameterBean.name}" /> <h:commandButton id="button1" value="Button1" actionListener= "#{ParameterBean.assembleMessage}" /> <h:commandButton id="button2" value="Button2" actionListener= "#{ParameterBean.assembleMessage}" /> <h:outputText id="message" value="#{ParameterBean.message}" /> 9 イベントリスナーの設定 <h:commandButton id="button1" value="Button1" actionListener= "#{ParameterBean.assembleMessage}" /> actionListener 属性の値は Method Binding 式と なっている。 ParameterBean の assembleMessage メソッドがイ ベントリスナーとなる。 10 イベントリスナーの実装 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); } 11 イベントリスナーのルール public void assembleMessage(ActionEvent event) { ……… } ActionEvent オブジェクトを引数にとる 返値はなし 12 ActionEvent オブジェクトの操作 String id = event.getComponent().getId(); イベントが起こったUIコンポーネント の id 属性の値を返す。 13 Action Method と Action Event Action Method と Action Event はよく似 ている。 単に画面遷移したいだけなら、Action Method を利用する。 outcome が便利 ActionEvent オブジェクトを利用することで、 イベント発生元のUIコンポーネントの情報 を取得できる。 14 Value Change イベント 15 やりたいこと (1) “Go!”ボタンが押されたとき、ラジオボタン の選択内容が変化していたらメッセージを 表示する 16 やりたいこと (2) “Go!”ボタンが押されても、ラジオボタンの 選択内容が変化していなかったらメッセー ジも変わらない。 17 JSPの記述 <h:selectOneRadio value="#{ParameterBean.sports}" valueChangeListener= "#{ParameterBean.assembleMessage}"> ……… </h:selectOneRadio> <h:commandButton id="button" value="Go!" /> <h:outputText id="message" value="#{ParameterBean.message}" /> 18 h:selectOneRadio 要素 (1) <h:selectOneRadio value="#{ParameterBean.sports}" valueChangeListener= "#{ParameterBean.assembleMessage}"> <f:selectItem itemValue="baseball“ itemLabel="野球" /> <f:selectItem itemValue="soccer“ itemLabel="サッカー" /> </h:selectOneRadio> 19 h:selectOneRadio 要素 (2) ラジオボタンを表す UIコンポーネント ラジオボタンは、1つだけ選択ができるボタンのグ ループ 選択されたボタンの値は value 属性で Value Binding を使う <h:selectOneRadio value="#{ParameterBean.sports}“> </h:selectOneRadio> 20 f:selectItem 要素 <f:selectItem itemValue="baseball“ itemLabel="野球" /> 1つの選択肢を表すUIコンポーネント itemValue 属性は、この選択肢が選ばれたときに h:selectOneRadio 要素の value 属性に入る値 itemLabel 属性は、表示される文字列 21 イベントリスナーの設定 <h:selectOneRadio value="#{ParameterBean.sports}" valueChangeListener= "#{ParameterBean.assembleMessage}"> </h:selectOneRadio> valueChangeListener 属性の値は Method Binding 式となっている。 ParameterBean の assembleMessage メソッド がイベントリスナーとなる。 22 イベントリスナーの実装 public void assembleMessage( ValueChangeEvent event) { String str = event.getNewValue().toString(); ...... if (str.equals("baseball")) { sb.append("野球"); } message = new String(sb); } 23 イベントリスナーのルール public void assembleMessage( ValueChangeEvent event) { ValueChangeEvent オブジェクトを引数にとる 返値はなし 24 ActionEvent オブジェクトの操作 String str = event.getNewValue().toString(); イベントが起こったUIコンポーネント の現在の値を返す。 25
© Copyright 2024 ExpyDoc