CookBook

IM-LogicDesignerで、ファイルアップロードに添付されたファイルの内容を、画面上に表示させる方法

投稿日:

このCookBookでは、IM-LogicDesignerで、ファイルアップロードに添付されたファイルの内容を、画面上に表示させる方法を紹介します。

完成イメージ

完成サンプル

以下の完成サンプルをダウンロードしてご活用ください。

IM-LogicDesigner インポート : im_cookbook_135770_logicdesigner-data.zip
IM-Formaアプリ インポート : im_cookbook_135770_forma.zip
IM-Forma データソース定義 インポート : im_cookbook_135770_datasource.zip

上記サンプルの利用条件は、以下の通りです。

  • IM-BIS 2017 Winter(8.0.15)以降のバージョンであること。
  • サンプルデータのインポートが行われていること。

サンプルはIM-BIS 2017 Winter(8.0.15)で動作確認を行っています。

ローカル環境でサンプルを動かしたい場合は、以下のURLにアクセスしてください。
http://localhost:8080/imart/forma/normal/view/regist_application_view/im_cookbook_135770_forma
なお、ベースURLである以下の部分は、環境に合わせて適宜変更してください。
http://localhost:8080/imart

レシピ

  1. フォームを作成する。
  2. ロジックフローを作成する。
  3. データソース定義を作成する。
  4. アイテムイベントを設定する。
  5. 作成したフォーム画面にて確認する。

1. フォームを作成する。

IM-FormaDesignerでフォームを作成し、ファイルアップロード 、イベントボタン、 添付されたファイルの内容を表示させるためのアイテム(サンプルでは、複数行文字列) を配置してください。

サンプルでは以下のように設定しています。
※以下に記載のない項目は、初期値を設定しています。

画面アイテム ラベル フィールド識別ID
複数行文字列 text info text_info

2. ロジックフローを作成する。

入出力設定を行ってください。

(1) ファイルアップロードタスクを利用するために、必要なパラメータを入力値として設定してください。
入力値は以下のとおりです。

項目名
imfr_application_id string
imfr_insert_id string
imfr_process_key string

(2) ファイルアップロードタスクから取得したファイルの内容を、出力値として設定してください。
出力値は以下のとおりです。

項目名
textInfo string

以下のようにフロー図を作成してください。

(3) ファイルIDを取得する。(ファイルアップロード情報取得)
ファイルIDを取得するため、applicationIdinsertIdprocessKey を以下のようにマッピングしてください。

  • input - imfr_application_id 」→「 im_bisFileUpload1 - applicationId
  • input - imfr_insert_id 」→「 im_bisFileUpload1 - insertId
  • input - imfr_process_key 」→「 im_bisFileUpload1 - processKey

(4) ファイル内容を取得する。(ファイルアップロード情報取得)
ファイルの内容を取得するため、applicationIdinsertIdprocessKeyfileId を以下のようにマッピングしてください。

  • input - imfr_application_id 」→「 im_bisFileUpload2 - applicationId
  • input - imfr_insert_id 」→「 im_bisFileUpload2 - insertId
  • input - imfr_process_key 」→「 im_bisFileUpload2 - processKey
  • im_bisFileUpload1 - fileId 」→「 im_bisFileUpload2 - fileId

(5) 取得したファイルの内容を返却する。(終了)
(4)で取得したファイルの内容を以下のようにマッピングしてください。

  • im_bisFileUpload2 - fileData 」→「 output - textInfo

3. データソース定義を作成する。

レシピ2で作成したロジックフローを、IM-LogicDesignerのデータソース定義として設定してください。
データソース定義設定の方法は、以下のドキュメントをご覧ください。
IM-BIS for Accel Platform システム管理者 操作ガイド / 「データソース - 編集[LogicDesigner]」画面の操作手順

4. アクションイベントを作成する。

リクエストタブでは、レシピ2の入出力設定で暗黙的に連携しているため、マッピングは必要ありません。
詳細は、以下のドキュメントを参照してください。
IM-BIS for Accel Platform IM-BIS 仕様書 / 9.12. 暗黙的に連携するリクエストパラメータの仕様

レスポンスタブでは、返却されたファイルの内容を画面アイテムにマッピングしてください。

5. 作成したフォーム画面にて確認する。

Forma管理画面から作成した場合、以下の手順でフォーム画面をメニューに登録してください。
IM-FormaDesigner for Accel Platform 作成者 操作ガイド / 5.1.6.2. アプリケーションの登録画面をメニューに登録する

作成したフォーム画面でファイルアップロードに任意のテキストファイルを添付し、Eventボタンをクリックしてください。
添付されたファイルの内容が、画面上に出力されます。

-CookBook
-,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

imuiTreeでドラッグ&ドロップのバリデーションを実装する方法

このCookBookでは、imuiTree (ツリービュー) のドラッグ&ドロップバリデーションについて紹介しています。 intra-mart Accel Platform では、画面上にツリーを表示 …

no image

画面に確認ダイアログ(コンファーム)を表示する

画面に確認ダイアログ(imuiConfirm)を表示する方法をご紹介します。 確認ダイアログとは以下の画像のように、ユーザが選択した操作を本当に実行するかどうか確認するための機能です。 確認ダイアログ …

no image

OAuth2.0 の アクセストークンを Google から取得する方法

このクックブックでは、OAuth2.0 の アクセストークンを Google から取得する方法を説明します。 intra-mart Accel Platformでは、OAuth2.0 の アクセストー …

no image

IM-LogicDesigner「繰り返し」「分岐」EL式の定義例

このCookBookでは、IM-LogicDesignerの「条件分岐」「繰り返し」制御要素の条件で利用するEL式について定義例を紹介しています。 ここでは主に「 IM-LogicDesigner上で …

no image

No.8 Excel からの一括ユーザ一括登録

この記事は、EWS 2017で行われたLogicDesignerの講演内容に関する記事です。 こちらの例では、LogicDesignerを利用して、入社や組織変更等の発生時に有用なExcelファイルの …

まだデータがありません。

RSSRSSRSSRSS