演習 演習 11． ． ．JSF Web ページ

IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
演習 11．
．JSF Web ページの
ページの作成
このセクションでは、HATS 統合オブジェクト実行に使用する JSF Web ページの作成方法につい
て取り上げます。
この演習では、引き続き演習 9 (および演習 10)で使用した HATS プロジェクトを使用します。
(実行可能な統合オブジェクトがあることが前提です。)
<目次>
A) JSF Web ページの作成
B) HATS 統合オブジェクトアプリケーションの実行 (その 1)
C) JSF Web ページのカスタマイズ
D) HATS 統合オブジェクトアプリケーションの実行 (その 2)
E) まとめ
11-1
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
A) JSF Web ページの
ページの作成
HATS 統合オブジェクトアプリケーションの実行に必要な Web ページを、JSF Web ページと
して作成します。
1)
「ソース」→「IntegrationObject」→「Datamacro」を選択し、右クリック→「JSF Web
ページの作成」を選択します。
11-2
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
2)
JSF Web ページの作成ウィザードが起動されます。
「基本情報」ページでは下記のようにデフォルト値を採用しますので、「次へ」ボタンを
押下してください。
3)
今回はデフォルト値を利用しますので、このまま「次へ」ボタンをクリックします。
(なお、この後 C)にてこのページをカスタマイズします。)
11-3
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
4)
「出力の定義」ページでは、すでにテーブル形式で抽出した部分が表示形式もテーブ
ルとして定義されています。表の各ヘッダーの表記を変更します。
はじめに、ヘッダーを変更するために、「result～」で始まる、テーブルが選択されてい
る出力を選択し、「編集」ボタンをクリックします。
「出力プロパティーの定義」が表示されますので、「先行テキスト」部分を下記のように
それぞれ変更してください。
変更前
変更後
resultCode
商品コード
resultName
商品名
resultHikiate
引当可能数
resultZaiko
実在庫数
11-4
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
5)
最後に「終了」ボタンを押下してください。
6)
入力および出力それぞれの JSP ファイルが、「Web コンテンツ」→「JSF ページ」以下に
生成されます。
11-5
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
B)
HATS 統合オブジェクトアプリケーション
その 1)
統合オブジェクトアプリケーションの
オブジェクトアプリケーションの実行 (その
先ほど作成した JSF Web ページを利用して HATS 統合オブジェクトを実行します。
1)
アプリケーションを実行します。入力用ページの「Web コンテンツ」→「JSF ページ」→
DatamacroInput にフォーカスを当て、右クリック→「サーバーでデバッグ」を選択して
ください。
2)
ブラウザーに「DatamacroInput.jsp」が表示されます。カテゴリ(AA または BB)を指
定してください。最後に「サブミット」ボタンをクリックします。
11-6
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
3)
統合オブジェクトが実施され、下記のような結果画面が表示されます。
11-7
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
C)
JSF Web ページの
ページの作成の
作成のカスタマイズ
ここからは、入力用の JSF Web ページをカスタマイズし、カテゴリの入力値の有無を確認す
るロジックを組み込みます。
入力値がない場合、統合オブジェクトは実行されなくなります。
1)
JSP を編集するために、ファイルを開きます。
「Web コンテンツ」→「JSF ページ」→「DatamacroInput」をダブルクリックして開いてく
ださい。
11-8
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
2)
DatamacroInput.jsp が開かれます。
プレビュー部分から、Category: の右側のボックスをクリックし、そこにフォーカスを移
します。その状態のまま、下の「プロパティー」タブをクリックします。
3)
次に「プロパティー」ビューの左側にあるタブのうち、「h:inputText」→「妥当性検査」
をクリックしてください。
そして、下記の 2 箇所のチェックを入れてください。
「値を必須にする」
「エラー･メッセージ･コントロールに検証エラー･メッセージを表示」
11-9
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
4)
「妥当性検査」の下の「振る舞い」に移動します。
下記の 2 箇所にチェックを入れてください。
「自動的に次のフィールドに進む」
「ブラウザーでフィールド値を検証」
さらに、「自動的に次のフィールドに進む」のすぐ下の「ユーザーが___文字入力したあ
と」の欄に 2 を入力してください。
5)
次に、「プロパティー」ビュー左側のメニューより、「h:form」→「キーボード補助機構」
へ移動します。
ビューの中央にある、「追加」ボタンをクリックします。
6)
「キー」欄にフォーカスを当てるとプルダウンメニューが表示されます。ここから「F12」
を選択します。実行時にこの画面で F12 を押下すると、次に定義するアクションが実
行されるようになります。
11-10
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
7)
DatamacroInput.jsp のソース部分を下へスクロールし、「<hx:behaviorKeyPress
key=”F12” … 」となっている行にカーソルをおきます。(下から 6 行目あたりです。)
そこで右クリックをし、「イベントの編集」を選択してください。
11-11
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
8)
「クイック編集」ビューが起動されます。この「クイック編集」ビューは、通常ワークベンチ
右側に表示されますので、必要に応じて移動してください。この演習ではソースを入力
しやすくするために、「プロパティー」ビューと同じ場所に移動させています。(ドラッグア
ンドドロップで移動可能です。)
下記のコードを記入してください。「F12」が押下されたときのアクションを定義します。
alert(‘参考：この画面では、操作性を向上させるためのコンポーネントが使用されています。’);
最後に保管ボタンをクリックするなどして、これまでの変更を保管してください。
9)
変更を保管し、ファイルを閉じてください。カスタマイズ作業はこれで終了です。
11-12
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
D)
HATS 統合オブジェクトアプリケーション
その 2)
統合オブジェクトアプリケーションの
オブジェクトアプリケーションの実行 (その
カスタマイズした Web ページを利用して、再度統合オブジェクトを実行します。
1)
アプリケーションを実行します。「サーバーでデバッグ」を選択してください。
11-13
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
2)
「DatamacroInput.jsp」が表示されます。
最初にカテゴリを入力しないで「サブミット」ボタンをクリックしてみてください。下記のよ
うな画面が表示され、入力値が必要なことをクライアントに知らせます。これは、先ほ
どのカスタマイズの C)-2)から 4)にあたります。
また、入力ボックス内にカーソルを置いた状態で「F12」キーを押下すると、下記のよう
なポップアップが表示されます。こちらは C)-5)から 8)で行ったカスタマイズです。
次に進めるために、カテゴリ(AA または BB)を指定してください。「サブミット」ボタンをク
リックします。
11-14
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
3)
統合オブジェクトが実行されると、手順 B)の時と同じように結果画面が表示されます。
11-15
IBM Rational Host Access Transformation Services (HATS) V8.0 ハンズオン資料
E)
まとめ
このように、統合オブジェクトは JSF ページでも実行することができます。
また、JSF で提供されている機能との連携も可能です。
11-16