kintone向けの無料プラグインを開発・提供しているkintacoです。この記事では、自社の「条件付き入力制御・書式変更プラグイン」で使用している空欄判定と保存時チェックを題材に、条件を1つに絞ったJavaScriptを解説します。
製品版のソース全体を掲載するものではありません。空欄判定は実コードと同じ処理を使い、設定の読み込み・複数条件・テーブル対応などを省いて、単独で読み込めるサンプルに再構成しています。サンプルだけで、今回の条件チェックを実装できます。
今回実現する動作
「申請区分」が「特別」の場合に、「理由」が空ならレコードの保存を止めます。「通常」の場合は、理由が空でも保存を許可します。
対象はPC版のレコード追加・編集画面の保存です。一覧のインライン編集、REST API、CSV読み込み、プロセス管理のアクション実行をこのコードで制御することはできません。
常に必須なら、フォームの標準設定を使う方が簡単です。この記事の例では、理由フィールドの標準の必須設定をオフにし、保存イベント内で条件を確認します。フィールドオブジェクトへ「required = true」を設定する方法ではありません。
検証用アプリに用意するフィールド
- ドロップダウン：フィールドコード「申請区分」。選択肢は「通常」「特別」。
- 文字列（複数行）：フィールドコード「理由」。標準の必須設定はオフ。
今回は項目名とコードを同じにしていますが、コードではフィールドコードを使います。すでに別のコードがある場合は、後述の定数を合わせてください。対象の利用者が両フィールドを閲覧でき、理由を編集できることも前提です。
サンプルコード
次の内容をJavaScriptファイルとして保存し、検証用アプリの「JavaScript / CSSでカスタマイズ」のPC用JavaScriptへ追加します。適用対象の利用者を確認し、設定を保存してアプリを更新してください。同じ処理を行う既存カスタマイズとは重複適用しないでください。
(function () {
'use strict';
const CATEGORY_CODE = '申請区分';
const REASON_CODE = '理由';
const REQUIRED_CATEGORY = '特別';
const FIELD_ERROR = '特別申請では理由を入力してください。';
const RECORD_ERROR = '特別申請の入力内容を確認してください。';
function isEmptyValue(value) {
return value == null || (Array.isArray(value) ? value.length === 0 : String(value).trim() === '');
}
kintone.events.on([
'app.record.create.submit',
'app.record.edit.submit'
], function (event) {
const record = event.record;
const category = record[CATEGORY_CODE];
const reason = record[REASON_CODE];
if (!category || !reason) {
event.error = '申請区分・理由のフィールドコードと閲覧権限を確認してください。';
return event;
}
// このサンプル自身が設定したメッセージだけを解除する。
if (reason.error === FIELD_ERROR) reason.error = null;
if (event.error === RECORD_ERROR) event.error = null;
const required = category.value === REQUIRED_CATEGORY;
if (required && isEmptyValue(reason.value)) {
reason.error = FIELD_ERROR;
// 先に実行された別の処理の画面上部エラーは残す。
if (!event.error) event.error = RECORD_ERROR;
}
return event;
});
})();
1．空欄判定で数値の0を未入力にしない
isEmptyValueは、実際のプラグインでも使っている空欄判定です。
function isEmptyValue(value) {
return value == null || (Array.isArray(value) ? value.length === 0 : String(value).trim() === '');
}
「!value」だけで判定すると、数値の0も未入力扱いになります。この実装は、null・undefined、要素0件の配列、空文字・空白だけの文字列を空と判定します。数値の0と文字列の「0」は入力済みです。
今回の対象は文字列（複数行）ですが、空欄判定の考え方は数値や複数選択でも再利用できます。ただし、計算フィールドなど、エラー表示に対応しないフィールドへそのまま広げないようにしてください。
2．保存イベントで条件と値を確認する
条件は「category.value === REQUIRED_CATEGORY」です。ドロップダウンの値が「特別」の場合だけ、理由の空欄を調べます。表示名の似た選択肢や、前後の空白がある別の文字列は一致しません。
空なら、理由フィールドのerrorへメッセージを設定します。続いてイベントオブジェクトをreturnすると、対象フィールドにエラーが表示され、保存がキャンセルされます。画面上部のevent.errorも補助的に設定しています。
エラー表示と対象イベントの対応は、公式ドキュメント「イベントオブジェクトで実行できる操作」で確認できます。
3．自分のメッセージだけを解除する
エラーのあとに値や申請区分を直して再保存する場合を考え、このサンプルが設定した文言だけをnullに戻しています。
無条件に「reason.error = null」「event.error = null」とすると、ほかのカスタマイズが設定したメッセージまで消す可能性があります。また、画面上部に先行するエラーがある場合は、その文言を残します。
ただし、複数の処理が同じフィールドのerrorを変更する場合や、後続の処理がエラーを上書きする場合まで保護できる仕組みではありません。導入時には、同じ項目に対する入力チェックとイベントの実行順を確認してください。
4．フィールドが取得できない場合を、通常申請とみなさない
フィールドコードの違いや閲覧権限によって、recordから対象を取得できない場合があります。このサンプルでは、条件を評価できないまま保存を通さず、画面上部へ確認メッセージを出します。
これはアクセス権を付与する処理ではありません。コードと権限を直し、実際の利用者で確認してください。非表示・編集不可の項目を条件付き必須にすると入力できなくなるため、画面設計との整合も必要です。
動作を確認するケース
- 「特別」＋理由が空：保存を止め、理由にメッセージを表示する。
- 「特別」＋理由が空白・改行だけ：同じく保存を止める。
- 「特別」＋理由あり：このチェックでは保存を止めない。
- 「通常」＋理由が空：このチェックでは保存を止めない。
- エラー後に「特別」から「通常」へ変更して再保存：自分のメッセージを解除する。
- 追加・編集の両方と、実際の担当者の権限で確認する。
この掲載コードは、Node.jsの模擬イベントオブジェクトで、空欄・条件不一致・再判定・別のエラーの保持・フィールド欠落・空欄判定の0と配列など17ケースを確認しました。kintoneの実画面での動作検証は含みません。組み込む前に検証用アプリで上のケースを確認してください。
条件が増えたときに見直すこと
複数条件をAND／ORで結ぶ、対象をテーブル内の列にする、同じ対象へ複数ルールを適用する、といった要件では、判定と対象フィールドの取得を分けて設計すると整理しやすくなります。とくにテーブル内の必須チェックは、各行のフィールドに対して行う必要があります。
設定画面から条件を管理したい場合は、自社で公開している条件付き入力制御・書式変更プラグインでも設定できます。複数条件・テーブル内項目・非表示・編集不可・書式変更などの対応範囲と設定画面は、リンク先で確認できます。今回のサンプルと製品版では、対応範囲が異なります。
プラグインは無料です。無料利用時は、非契約ドメインのPC・モバイル一覧画面に有償プランの案内バナーが30%の確率で表示されます。契約済みドメインでは表示されず、一度閉じると同じブラウザー・同じkintoneドメインでは全Kintacoプラグイン共通で24時間非表示になります。
まずは1条件・1項目で動作を確かめ、利用する画面と保存経路を増やす際にチェック範囲を見直すのがおすすめです。
参考資料
記事の製品仕様は1.0.17をもとにしています。最新の仕様は詳細ページをご確認ください。