JSONデータサービスの使用

デザイナーにてJSONデータセットを追加し、データを帳票にバインディングします。

JSONデータサービスの使用

e-FormからJSON文字列を取得

1. membership-odiparam.ozr をmembership-jsonset.ozr にコピーし、membership-jsonset.ozr

   ファイルを開きます。

2. フォームをプレビューし、入力フィールドを入力します。

3. ビューアの右上にあるEtc アイコン()をクリックして”入力データコピー (json)”を選択します。

4. メモ帳を開き、クリップボードの文字列を貼り付けて、テキストファイル（jsonset.txt）として保存します。

JSONデータサービスの作成

1. データ情報タブでDataServiceを右クリックして”JSONデータセットの追加”を選択します。

2. ”JSONデータセットの追加”ダイアログでパスをクリックし、デザインタイムのデータセットとランタイムデータセットにjsonset.txtファイルを追加します。

3. 必要ある場合、デフォルトのデータセット名のJSON_Set1を変更します（例：jsonsetに変更）。

4. 画面の下段でJSONデータの文字セットが設定できます。

5. データセット名を右クリックしてセットの構成を選択します。

6. ルートノードの$記号を右クリックし、基準JSONPATH指定を選択します。

7. データセットに含めたいすべてのフィールド項目を選択し、フィールドの追加を選択します。

8. 画面の下部に追加されたフィールドが表示されます。OKをクリックします。

9. データ情報タブのDataService下のjsonsetデータセットにフィールドが追加されたことが確認できます。

10. memberデータセットの代わりにDataServiceのjsonset が使用できるようになりました。ODIのmembershipを削除し、memberデータセットフィールドのマッピングをすべてjsonsetのDataServiceのマッピングに置き換えます。

11. プレビューをします。jsonset.txtの値をフォームの入力コンポーネントに入力できます。

JSONデータセットにデータを渡すためのパラメータの作成

1. アプリケーションからJSONデータを取得してフォームファイルに渡すには、先ず、OZFormParamの下にjsondataパラメータを追加する必要があります。

2. その後、jsondataからjsonsetにデータを渡す必要があります。

3. jsonsetを右クリックして編集を選択します。

4. ランタイムデータセットの適用方法からパラメータ(データ)を選択した後、パラメータ...をクリックします。

5. パラメータ設定ダイアログでjsondataパラメーターを選択します。

6. OKを2回クリックします。

7. ファイルを保存します。

JSONデータをe-Formに送信

以下のようにアプリケーションからJSONデータをフォームファイルに渡すことができます。

JSON文字列についてはエスケープ処理が必要です。

<script type="text/javascript" >
var serverUrl = "https://" + location.host;
var jsondata = "{\"memberNo\":\"1011\",\"photo\":\"\",\"firstName\":\"John\",\"lastName\":\"Kim\",\"yyyy\":\"1979\",\"mm\":\"09\",\"dd\":\"05\",\"gender\":\"M\",\"contactNo\":\"010-6369-7777\",\"email\":\"[email protected]\",\"memberType\":\"Trial\",\"fromDate\":\"2019-12-24\",\"toDate\":\"2020-12-24\",\"cardType\":\"VISA\",\"cardHolder\":\"\",\"cardNo\":\"1111-2222-3333-4444\",\"cardExpMM\":\"11\",\"cardExpYY\":\"24\",\"agreeCheck\":\"N\",\"applicant\":\"John\",\"sign\":\"\",\"signDateTime\":\"signDateTime\"}";
function SetOZParamters_OZViewer(){
	var oz = document.getElementById("OZViewer");
	oz.sendToActionScript("information.debug", "true"); // viewer console
	oz.sendToActionScript("connection.servlet",serverUrl + "/oz/server");
	oz.sendToActionScript("connection.reportname","/eform/membership-jsonset.ozr");
	oz.sendToActionScript("connection.pcount", "1");
	oz.sendToActionScript("connection.args1", "jsondata=" + jsondata);
	oz.sendToActionScript("etcmenu.copyinputdata_json", "true"); // enable [Copy input data (json)] option in etc menu
	return true;
}
start_ozjs("OZViewer", serverUrl + "/oz/HTML5viewer/");
</script>

Run example

12KB

membership-jsonset.zip

archive

開く

membership-jsonset.zip