IM-FormatCreator
クラス指定手順書
1 はじめに 1
1.1 目 的
1
2 プログラムの作成 2
2.1
ファンクション・コンテナ(.JS)の作 成
2
2.2
プレゼンテーションページ(.HTML)の作 成
3
3 クラス指定項目の設定 5
3.1
「クラス指 定 」設 定 画 面
5
3.2
「クラスパス」の設 定
5
3.3
「パラメータ」の設 定
6
3.3.1 パラメータ名
6
3.3.2 パラメータ値
6
3.3.3 追 加
6
3.3.4 パラメータ値
7
4 画面動作 8
4.1
申 請 書 画 面 動 作
8
1 はじめに
1
はじめに
1.1 目的
IM-FormatCreator ver6.0.1では、申 請 書 作 成 時 に「クラス指 定 」項 目 を設 定 することで、
作 成 した申 請 書 から任 意 のプログラムを呼 び出 すことが可 能 となります。
ここでは「クラス指 定 」の設 定 方 法 を製 品 にて提 供 しているクラス指 定 サンプル
プログラムを例 に説 明 します。
2 プログラムの作 成
2
プログラムの作成
「クラス指 定 」項 目 から呼 び出 されるプログラムの作 成 方 法 を製 品 同 梱 のサンプルプログラムを例 に
以 下 に記 載 します。
2.1 ファンクション・コンテナ(.JS)の作成
ファンクション・コンテナのinit関 数 を作 成 します。ファイル名 はclass_sample.jsとします。
このclass_sample.jsでは、次 のことを実 現 します。
① クラス指定(画面)項目にて設定したパラメータ名、パラメータ値をrequestオブジェクトから抽出します。 ② 抽出したデータをHTMLへ引き渡します。requestオブジェクトには、次 の章 で記 載 されているクラス指 定 項 目 に指 定 した
パラメータ名 、パラメータ値 が引 き渡 されます。
ここでは、以 下 情 報 が引 き渡 されるものとします。
<requestオブジェクト>
パラメータ名
パラメータ値
param1
(任 意 のパラメータ)
値 1
param2
(任 意 のパラメータ)
値 2
call_back
(変 更 不 可 )
呼 び出 し元 の識 別 用 パラメータ
<クラス指定項目からのデータ取得用class_sample.js> // HTMLへ渡す値を宣言します var callBack; var param_list; // init関数の定義 function init(request) { // 変数宣言 var i =1; // ループカウンタ var cnt = 0; // ループカウンタ var cnt_flg = true; // データ件数判定フラグ param_list = new Array(); // データ配列格納用 callBack = request.call_back;// データ配列の生成 while(cnt_flg){
var param_data = request.getParameterValue("param" + i); // パラメータを抽出して格納
if(!isNull(param_data) && !isUndefined(param_data) && param_data != "undefined"){ var objParam = new Object();
objParam.param = "param" + i; objParam.param_value = param_data; param_list[cnt] = objParam; cnt ++; }else{ cnt_flg = false;
2 プログラムの作 成 i ++; } }
2.2 プレゼンテーションページ(.HTML)の作成
次のHTMLファイルは、JSからバインドされた値を表示するソースの例です。
このclass_sample.htmlでは、次 のことを実 現 します。
① class_sample.js からバインドされた値を画面に表示します。 ② 「設定」ボタンをクリックすることで選択された値を呼び出し元の画面(申請書画面上フレーム)に表示します。 <HTML> <HEAD> <IMART type="imDesignCss"></IMART><META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript"> <META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css">
<SCRIPT language="JavaScript"> function call_back() { var sel_value; // 選択された値の格納 if(document.mainForm.example.value != undefined){ sel_value = document.mainForm.example.value; }else{ for(var i = 0;i<document.mainForm.example.length;i++){ if(document.mainForm.example[i].checked == true){ sel_value = document.mainForm.example[i].value; } } } if(sel_value == undefined){ sel_value = ""; }
window.opener.document.<IMART type="string" value=callBack></IMART>.value = sel_value; window.close(); } </SCRIPT> <BODY> <!-- タイトルバー -->
<IMART type="imTitleBar" title="クラス指定_sample"></IMART> <!-- ツールバー --> <IMART type="imToolbarFrame"> <IMART type="imToolbarLeft"> <IMART type="imIcon" name="設定" href="JavaScript:call_back()" icon="images/standard/edit.gif"> </IMART> </IMART> <IMART type="imToolbarRight"> <IMART type="imIcon"
2 プログラムの作 成 name="閉じる" href="javascript:window.close();" icon="images/standard/close.gif"> </IMART> </IMART> </IMART> <BR> <CENTER> <FORM name="mainForm"> <TABLE class="edit"> <!-- パラメータリストの生成 -->
<IMART type="repeat" list=param_list item="list" index="idx"> <TR>
<TD class="bottom">
<IMART type="input" style="radio" name="example" value=list.param_value></IMART> </TD>
<TD class="bottom" width="100" nowrap>
<STRONG><IMART type="string" value=list.param></IMART></STRONG> </TD>
<TD class="bottom">
<IMART type="input" style="text" class="default"
name="param" value=list.param_value readonly></IMART> </TD> </TR> </IMART> </FORM> </CENTER> </BODY> </HTML>
z
window.opener.document. <IMART type="string" value=callBack></I MART>.value = sel_value;→ 作 成 す る HTML で は 、 上 記 任 意 の プ ロ グ ラ ム 上 で 選 択 し た パ ラ メ ー タ を 呼 び 出 し 元 ( 親 画 面 ) の入 力 値 に格 納 する処 理 を必 ず実 装 してください。
3 クラス指 定 項 目 の設 定
3
クラス指定項目の設定
「クラス指 定 」項 目 の設 定 方 法 を以 下 に記 載 します。
3.1 「クラス指定」設定画面
[マスタメンテナンス] -[申 請 書 メンテナンス] -[申 請 書 項 目 一 覧 ] -[申 請 書 項 目 設 定 ]
3.2 「クラスパス」の設定
クラスパス
任 意 のプログラムパスを入 力 します。
指 定 方 法
Resource Serviceをインストールしたディレクトリ/pages配 下 からの
ファイルパス(拡 張 子 なし)を設 定 します。
z
製 品 に て 提 供 さ れ て い る ク ラ ス 指 定 の サ ン プ ル プ ロ グ ラ ム で 動 作 確 認 を 行 う 場 合 に は 「 ク ラ ス パ ス 」 に “/format_creator/sample/class_sample”を設 定 下 さい。3 クラス指 定 項 目 の設 定
3.3 「パラメータ」の設定
3.3.1 パラメータ名
パラメータ名
任 意 のプログラムに引 き渡 すパラメータ名 を設 定 します。
指 定 方 法
ここで指 定 したパラメータ名 で、任 意 のプログラムに引 き渡 されるの
で、任 意 のプログラムで取 得 可 能 なパラメータ名 を設 定 します。
z
製 品 に て 提 供 さ れ て い るク ラス 指 定 のサ ン プ ル プ ロ グ ラ ム で 動 作 確 認 を行 う 場 合 に は 「 パ ラ メ ー タ 名 」に "param + 行 番 号 "を指 定 して下 さい。 (例 )1行 目 :param1 / 値 1 2行 目 :param2 / 値 23.3.2 パラメータ値
パラメータ値
任 意 のプログラムに引 き渡 すパラメータ値 を設 定 します。
指 定 方 法
ここで指 定 したパラメータ値 が、任 意 のプログラムに引 き渡 されるの
で、任 意 のプログラムで使 用 する値 を設 定 します。
3.3.3 追加
追 加
このボタンをクリックすると、ボタンのある項 目 のひとつ下 に新 しい項
目 (行 )が追 加 されます。
3 クラス指 定 項 目 の設 定
3.3.4 パラメータ値
4 画 面 動 作
4
画面動作
4.1 申請書画面動作
1
作 成 した申 請 画 面 でクラス設 定 項 目 の「開 く」ボタンをクリックします。
任 意 に作 成 したプログラムがポップアップ画 面 で表 示 されます。
※ 以 下 製 品 同 梱 のサンプルプログラムを例 に説 明 します。
2
ポップアップで開 いた任 意 のプログラム画 面 で親 画 面 に引 き渡 すパラメータ
を選 択 して「設 定 」ボタンをクリックします。
4 画 面 動 作