JavaScript API を利用し、日付の大小をチェックして値を入れ替える

日付の大小チェックを行い、値を入れ替えるサンプルをご紹介します。

サンプルについて

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

利用するイベント

• パーツ値変更イベント

サンプルフォーム

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

パーツID	パーツタイプ	補足
fidStartDate	日付パーツ	開始日
fidEndDate	日付パーツ	終了日

カスタマイズコード

(function () {

    'use strict';

    collaboflow.events.on(['request.input.fidStartDate.change', 'request.input.fidEndDate.change'], function (e) {

        const parts = e.parts;
        const startDate = parts['fidStartDate'].value;
        const endDate = parts['fidEndDate'].value;

        if (startDate === '' || endDate === '' || startDate <= endDate) {
            // 日付が未入力か、大小が正常なら処理しない
            return;
        }

        parts['fidStartDate'].value = endDate;
        parts['fidEndDate'].value = startDate;
    });

})();

動作の確認手順

1. サンプルのカスタマイズコードをjsファイルに保存します。
2. アプリ設定＞フォーム設定から新規に通常フォームを作成します。
3. サンプルフォームに、先で記載されている必要な項目を配置します。
4. サンプルフォームを再度表示し、カスタマイズタブを表示します。
5. 保存したファイルをアップロードします。
6. アプリ設定＞経路設定から新規に経路を作成します。
7. 新規文書から作成した経路名をクリックします。
8. 任意に日付を入力します。
9. 開始日に終了日よりも大きい日付を指定すると、自動的に値が入れ替わります。