概要
ServiceNowで開発するうえで、フォームを送信する前に日付の比較検証(バリデーション)をしてほしいという要望は多くあると思います。もっとも要望が多く単純なものは、**『ユーザーが日付フィールドを入力する際に【開始日＜終了日】のチェックをしてほしい』**というものだと思います。
日付を検証する方法としてコミュニティによく上がっているのは、GlideAjaxを使用して、サーバサイドで日付の比較処理を行いその結果をクライアントに返す方法やgetDateFromFormat関数を用いて日付の値を取得しより簡単に日付オブジェクトを扱う方法が見られますが、UIポリシーを用いることでLowCodeで簡単に日付検証を行うことができます。
本記事では、ServiceNowの日付フィールドの概要を説明しつつ、実際に日付フィールドの比較検証を行う方法をまとめました。
UIポリシーで日付の検証を実装する
UIポリシーとはクライアントサイドで動作を制御できる機能になっており、クライアントスクリプトと違いフィールドの必須、読み取り専用、表示/非表示、フィールド値のクリアをGUIで簡単に設定できるのが特徴です。また、UIポリシー上でもスクリプトを記述することも可能です。
今回はよりユーザーに対して、エラーメッセージを表示するために簡単なスクリプトも記述していきます。
実装環境と事前準備
バージョン：Rome
使用言語：日本語
あらかじめ検証用に以下のカスタムテーブルとフィールドを作成した。
| コンポーネントタイプ | 名前 | ラベル名 | フィールドタイプ |
|---|---|---|---|
| テーブル | u_date_time_test | Date_Time_Test | × |
| フィールド | u_start_date | 開始日 | Date/Time型 |
| フィールド | u_end_date | 終了日 | Date/Time型 |
##実装手順と解説
###UIポリシー設定画面までの遷移方法
新規でUIポリシーを作成するには以下のルートが存在します。
・アプリケーションナビゲーター：[システムUI]>[UI ポリシー]
・フィルターナビゲーター：『<テーブル名>.config』で検索し、UIポリシータブを選択
・作成対象のテーブルのレコードのフォームコンテキストメニュー：[構成]>[UIポリシー]
###作成したUIポリシーの全体像
###解説
全体像の画像から重要なポイントはUIポリシーの実行条件、UIポリシーアクション、Trueの場合に実行するスクリプトです。１つずつ開設していきましょう。
-
UIポリシーの実行条件
ここではこのUIポリシーの実行条件を設定することができます。この条件を満たすことで、設定したUIポリシーアクションとスクリプトが実行されます。
日本語だと条件文が理解しづらいですが、簡単に要約すると【開始日＞終了日＋０ｈ】となります。
０時間という表記が謎ですが、[は次より大きい]では基準日（今回で言う終了日）の日時をズラすことができます。時間や日にちのオフセットをつけることができるので【開始日＞終了日＋4h】や【開始日＞終了日＋２D】といった条件分を作成可能ですが、今回はオフセットを持たせる必要がないので０時間という条件設定にしています。 -
UIポリシーアクション
UIポリシーアクションは条件がTrueになった際に設定したフィールドに対して、必須や読み取り専用といった制御を加えることができます。
今回は開始日＞終了日になった場合に、終了日の値をクリアにする設定にしています。 -
Trueの場合に実行するスクリプト
function onCondition() {
g_form.hideFieldMsg('u_end_date'); //終了日の下に表示されているメッセージを消去す
//引数はメッセージを消したいフイールドのフィールド名
g_form.showFieldMsg('u_end_date',"開始日＜終了日にしてください！！",'error'); //エラーメッセージを表示する
//引数は<メッセージを表示させるフィールド名>,メッセージの内容>,<'error'か'info'>
}
メッセージの削除→メッセージの表示の順序にすることで、エラーメッセージが連続して表示されていくのを防ぎます。また、g_form.showFieldMsgの引数に'error'を渡すことで、メッセージボックスの色を赤色にすることができます。
###実装結果
上記のように日付の比較検証を実装することができました。