CookBook

画面操作方法によって画面アイテムの入力チェックを切り替える方法

投稿日:

このCookBookでは、IM-FormaDesignerの入力チェックプログラムで、画面の操作方法に応じた入力チェックを設定する方法を紹介します。

この方法は、以下の製品で作成したアプリケーションやフローで利用できます。
IM-FormaDesigner
IM-BIS

完成イメージ


サンプルではタブ切替可能な画面を使用し、以下の画面操作に応じた入力チェックを設定しています。
1. タブ切替
・画面アイテムに対する必須入力チェック、条件付き必須入力チェックは行われません。
2. tab-2画面にて「一時保存」ボタンをクリック
・tab-1画面のRadio に対する必須入力チェックが行われます。

3. tab-2画面にて「登録」ボタンをクリック
・tab-1画面のRadio に対する必須入力チェックが行われます。
・tab-1画面のRadio が選択されている場合、選択内容に応じた条件付き入力チェックが行われます。
  "Type1" 選択 : tab-2画面のText1 に対する必須入力チェックが行われます。

  "Type2" 選択 : tab-2画面のText2 に対する必須入力チェックが行われます。

完成サンプル

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

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

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

  • intra-mart Accel Platform(Advanced) 2017 Winter(8.0.18), IM-FormaDesigner 2017 Winter(8.0.17)以降のバージョンであること
  • サンプルデータのインポートが行われていること

サンプルは、intra-mart Accel Platform(Advanced) 2017 Winter(8.0.18), IM-FormaDesigner 2017 Winter(8.0.17)で動作確認を行っています。

レシピ

  1. アプリケーションを作成する。
  2. 入力チェックプログラムを作成する。
  3. アプリケーションに入力チェックプログラムを設定する。

1. アプリケーションを作成する。

IM-FormaDesignerで、アプリケーション種別「標準」のアプリケーションを作成しましょう。
このCookbookでは、タブ切替を行う画面を使用する為、以下の3つのフォームを作成します。
・メインフォーム
・tab-1用フォーム
・tab-2用フォーム

フォームの作成とタブ切替の設定については、以下のドキュメントを参照してください。
IM-FormaDesigner for Accel Platform IM-FormaDesigner 作成者 操作ガイド - 「5.2.5. アプリケーションで画面遷移・タブ切替を設定する」

2. 入力チェックプログラムを作成する。

サンプルでは以下の場所にファイルを作成しています。
src/main/jssp/src/im_cookbook_133072/forma_validation.js

  • sendParam["imfr_transition_mode"]の値で画面操作方法を判断することができます。
    'tab_contents' : タブ切替
    ''(空文字) : 処理ボタン押下
  • formaParam["temporaryFlag"]の値で処理ボタンの種類を判断することができます。
    '0' : 登録・更新ボタン
    '1' : 一時保存ボタン
  • sendParam["imfr_other_form_param"]
    他のフォームの入力項目を保持しています。tab-1画面のアイテムRadioの設定値を取得することができます。

入力チェックプログラムについては、以下のドキュメントを参照してください。
IM-FormaDesigner for Accel Platform プログラミングガイド - 「4. 入力チェックプログラム」

3. アプリケーションに入力チェックプログラムを設定する。

レシピ1 で作成したアプリケーションのユーザプログラムに、レシピ2 で作成した入力チェックプログラムを設定しましょう。

入力チェックプログラムの設定については、以下のドキュメントを参照してください。
IM-FormaDesigner for Accel Platform 作成者 操作ガイド - 「5.4.2. アプリケーションでユーザプログラムを利用する」

-CookBook
-

執筆者:


comment

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

関連記事

no image

IM-FormaDesignerでアップロードしたExcelファイルの内容を画面上に出力する方法

このCookBookでは、IM-FormaDesignerでBISフローの申請画面にてアップロードしたExcelファイルの内容を承認画面にて出力する方法を紹介します。 完成イメージ 完成サンプル 以下 …

no image

ウォッチ機能のご紹介

このCookBookでは「intra-mart Accel Collaboration」に備わっているウォッチ機能のご紹介です。 各会社様でグループで仕事をする機会が多いと思います。 仕事を行う上で、 …

IM-Wiki

Wiki機能の活用例

このCookbookでは、intra-mart Accel Platform 2018 Springから利用可能なWiki機能(IM-Wiki)の活用例について紹介します。 今回の記事では実際にWik …

no image

Solr の Docker を作成する。

この CookBook では、Solr の Docker の作成手順について紹介しています。 レシピ ベースイメージの作成 Solr の Docker イメージを作成します 実行します 1. ベースイ …

no image

request.log を Kibana で可視化する方法

この CookBook では、request.log を Kibana で可視化する方法について紹介しています。 方法は色々ありますが、この CookBook では Logstash と logsta …

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

RSSRSSRSSRSS