複数のチェックボックスパーツの値を独自に必須チェックする
複数のチェックボックスをグループとみなし、独自に必須チェックを行うサンプルを紹介します。
サンプルについて
本サンプルのソースコードについてや、カスタマイズ方法等の技術的なお問合せは承っておりません。
利用するイベント・API
申請入力画面イベント（申請内容確認ボタンクリックイベント）
サンプルフォーム
サンプルで利用するフォームには、以下のパーツを配置しています。
パーツID | パーツタイプ | 補足 |
fidCheckA | チェックボックスパーツ | チェック時の表示コメント:有 未チェック時の表示コメント：無 必須：OFF |
fidCheckB | チェックボックスパーツ | チェック時の表示コメント:有 未チェック時の表示コメント：無 必須：OFF |
fidCheckC | チェックボックスパーツ | チェック時の表示コメント:有 未チェック時の表示コメント：無 必須：OFF |
カスタマイズコード
カスタマイズコードCopied!
(function() { 'use strict';
collaboflow.events.on('request.input.check', function(e) { const partsData = e.parts;
// 1つもチェックがされていない if (partsData['fidCheckA'].value === '無' && partsData['fidCheckB'].value === '無' && partsData['fidCheckC'].value === '無' ) {
alert('チェック項目が未入力です。'); return false; }
return true; });
})();
動作の確認手順
1. サンプルのカスタマイズコードをjsファイルに保存します。
2. アプリ設定＞フォーム設定から新規にフォームを作成します。
3. サンプルフォームに、先で記載されている必要な項目を配置します。
4. サンプルフォームを再度表示し、カスタマイズタブを表示します。
5. 保存したファイルをアップロードします。
6. アプリ設定＞経路設定から新規に経路を作成します。
7. 任意に経路アイテムを配置して、経路を作成します。
8. 新規文書から作成した経路名をクリックします。
9. 申請内容確認ボタンをクリックすると、チェックボックスパーツの入力チェックが行われます。
10. 1つもチェックが無ければ、メッセージが表示され、内容確認画面へは遷移されません。 