コンテンツにスキップ
「プリザンター入門」発売中！

hidden.Add

概要

サーバスクリプトでHTMLのhiddenに新しい要素を追加します。

構文

hidden.Add(key, value);

パラメータ

No パラメータ 型 必須 概要
1 key string ○ hidden要素のid
2 value object ○ hidden要素のvalue

戻り値

戻り値はありません。

使用例

以下の例では、自身が所属するグループのIDの配列をJSONに変換して、hidden要素（ID:MyGroups）に出力します。

JavaScript
hidden.Add('MyGroups', JSON.stringify(Array.from(context.Groups)));

サンプルコード

Note

コード内の【 ... 】は適宜修正してください。

1. 祝日・会社休日を画面に渡し、納期に休業日を選んだらその場で知らせる

受注の新規作成・編集の画面を開いたとき、サーバスクリプトで祝日カレンダーの今日以降の祝日・会社休日を取得し、hidden.Addで画面に渡します。画面のスクリプトは、納期を選んだときにその一覧と土日を見て、休業日なら納期の欄の下に注意を出します。保存は止めません。

実務での使いどころ

納期・訪問日・出荷日を休業日に入れてしまい、あとで顧客や手配先と調整し直すのを防げます。日付項目の入力検証では、別テーブルに登録した祝日・会社休日に当たるかは確かめられません。hidden.Addで一覧を渡しておけば、画面を開いた時点で一覧がそろっていて、日付を選ぶたびにその場で確かめられます。

事前準備

1:祝日カレンダーとなる記録テーブルを用意してください。祝日を取り込むサンプル（items.Upsert・$p.apiUpsertに掲載）で作成したテーブルをそのまま使えます。

項目コード 内容
日付A（DateA） 日付
分類A（ClassA） 名称（例：文化の日、年末休業）

2:「受注」テーブル（期限付きテーブル）で、日付A（DateA）を納期として有効化してください。

3:「受注」テーブルにサーバスクリプトを登録します。

3-1:「テーブルの管理 > サーバスクリプト」タブで「新規作成」を選択する。
　3-2:タイトル: 任意の名前（例：passHolidaysToEditor）
　3-3:スクリプト: 下記のサーバスクリプトを貼り付け、【祝日カレンダーのサイトID】を置き換える
　3-4:条件: 「画面表示の前」にチェック

JavaScript（サーバスクリプト）
// 祝日カレンダーのサイトID（日付は DateA、名称は ClassA）
const HOLIDAY_SITE_ID = 【祝日カレンダーのサイトID】;

// Date を「yyyy/MM/dd」の文字列にする（画面のスクリプトと同じ形にそろえる）
function formatDate(date) {
    const pad = (n) => String(n).padStart(2, '0');
    return `${date.getFullYear()}/${pad(date.getMonth() + 1)}/${pad(date.getDate())}`;
}

// 新規作成・編集の画面で、今日以降の祝日・会社休日を画面に渡す
if (context.Action === 'new' || context.Action === 'edit') {
    const holidayView = { View: { ColumnFilterHash: { DateA: `["${formatDate(new Date())},"]` } } };
    const holidays = {};
    for (const holiday of items.Get(HOLIDAY_SITE_ID, JSON.stringify(holidayView))) {
        holidays[formatDate(holiday.DateA)] = holiday.ClassA;
    }
    // 画面に <input type="hidden" id="Holidays"> ができ、値に {"2026/11/03":"文化の日", …} が入る
    hidden.Add('Holidays', JSON.stringify(holidays));
}

4:「受注」テーブルにスクリプトを登録します。

4-1:「テーブルの管理 > スクリプト」タブで「新規作成」を選択する。
　4-2:タイトル: 任意の名前（例：warnHolidayDueDate）
　4-3:スクリプト: 下記のスクリプトを貼り付け
　4-4:出力先:「すべて」のチェックを外し、「新規作成」と「編集」にチェック

JavaScript（スクリプト）
/**
 * ================================================================
 * サンプル  納期に休業日を選んだら、その場で知らせる
 * ================================================================
 *
 * 【概要】
 *   受注の編集画面で納期を選んだとき、祝日・会社休日（サーバスクリプトが hidden.Add で
 *   渡した一覧）と土日に当たれば、納期の欄の下に注意を出します。保存は止めません。
 *
 * 【使い方】
 *   出力先：新規作成、編集
 *   サーバスクリプト「passHolidaysToEditor」（画面表示の前）と一緒に使います。
 * ================================================================
 */

// 納期の項目と、休業にする曜日（0:日曜〜6:土曜）
const DUE_DATE_COLUMN = 'DateA';
const CLOSED_WEEKDAYS = [0, 6];

function formatDate(date) {
    const pad = (n) => String(n).padStart(2, '0');
    return `${date.getFullYear()}/${pad(date.getMonth() + 1)}/${pad(date.getDate())}`;
}

// 納期が休業日なら、納期の欄の下に注意を出す（休業日でなければ消す）
// 画面下のメッセージ欄は使わない（保存したときの「更新しました」を消してしまうため）
function checkDueDate(holidays) {
    $('#DueDateWarning').remove();
    const value = $p.getControl(DUE_DATE_COLUMN).val();
    const date = new Date(value);
    if (!value || isNaN(date)) {
        return;
    }
    const day = formatDate(date);
    const reason = holidays[day] || (CLOSED_WEEKDAYS.includes(date.getDay()) ? '土日' : '');
    if (reason) {
        $p.getField(DUE_DATE_COLUMN).find('.field-control').append(
            `<div id="DueDateWarning" style="color: #c62828;">⚠ ${day} は休業日（${reason}）です</div>`,
        );
    }
}

$p.events.on_editor_load = function () {
    // サーバスクリプトが hidden.Add で出した一覧を読む（無ければ祝日なしとして扱う）
    const holidays = JSON.parse($('#Holidays').val() || '{}');
    $p.getControl(DUE_DATE_COLUMN).on('change', () => checkDueDate(holidays));
    checkDueDate(holidays);
};

注記

  • hidden.Add('Holidays', 値)で、画面に<input type="hidden" id="Holidays">ができ、値が入ります。画面のスクリプトからは$('#Holidays').val()で読めます。
  • サーバスクリプトの中では、変数名にviewを使わないでください。サーバスクリプトのviewオブジェクトと重なります。
  • 注意は、画面下のメッセージ欄ではなく、納期の欄の下に出しています。メッセージ欄に出すと、保存したときの「更新しました」を消してしまうためです。
  • 休業にする曜日はCLOSED_WEEKDAYSで変えられます（0：日曜〜6：土曜）。

関連情報