マスター連携パーツで1つのマスター項目を複数項目にセットする

マスター連携パーツで1つのマスター項目を複数項目にセットするサンプルをご紹介します。

サンプルについて

本サンプルのソースコードについてや、カスタマイズ方法等の技術的なお問合せは承っておりません。

動作イメージ

利用するイベント

• 申請入力画面イベント - パーツ値変更イベント

サンプルフォーム

サンプルで利用するフォームには、以下のパーツを配置しています。

パーツID	パーツタイプ	補足
fidProductMaster	マスター連携パーツ	パーツ設定のデータ配置で、マスター項目をパーツ「商品名1」「金額1」へ関連付けする
fidProductName1	テキスト（一行）パーツ	ノーマル
fidProductName2	テキスト（一行）パーツ	ノーマル
fidAmount1	テキスト（一行）パーツ	金額型
fidAmount2	テキスト（一行）パーツ	金額型

カスタマイズコード

(function () {
    "use strict";

    collaboflow.events.on('request.input.fidProductName1.change', function (data) {
        const productName = data.parts['fidProductName1'].value;

        // マスター連携パーツでセットされた値を別項目にセット
        data.parts['fidProductName2'].value = productName;
    })

    collaboflow.events.on('request.input.fidAmount1.change', function (data) {
        const amount = data.parts['fidAmount1'].value;

        // マスター連携パーツでセットされた値を別項目にセット
        data.parts['fidAmount2'].value = amount;
    })
})();

動作の確認手順

1. アプリ設定＞フォーム設定から新規に通常フォームを作成します。
2. サンプルフォームに、先で記載されている必要な項目を配置します。
3. サンプルフォームを再度表示し、カスタマイズのタブを表示します。
4. サンプルのJavaScriptカスタマイズコードをjsファイルに保存します。
5. 保存したファイルをアップロードします。
6. アプリ設定＞経路設定から、先のフォームを利用した経路を作成します。
7. 新規文書から作成した経路名をクリックします。
8. 申請画面が表示されます。
9. マスター連携パーツから検索をおこない、レコードを選択します。
10. パーツ「商品名1」「金額1」にセットされた値が、パーツ「商品名2」「金額2」にもセットされます。