コンテンツにスキップ

context.AddResponse

概要

サーバスクリプトで任意のクライアントレスポンスを返却します。

制限事項

  1. リンクしたアイテムの作成ボタンでの子レコードの作成後の画面遷移など、method「Href」を指定しても製品側仕様が優先する場合があります。

構文

context.AddResponse(method,target,value)

パラメータ

パラメータ 型 概要
method string レスポンスの操作種別を指定します。下記のmethod部分を参照してください。
target string 対象の要素のIDを指定します。
value object 要素や値を指定します。

メソッド

種別 説明
ReplaceAll 上記のtargetに指定した要素をvalueに指定した要素に置き換えます。
Set フォームに情報を格納します。
Href ポストバック後の遷移先URLを指定します。

戻り値

戻り値はありません。

使用例①

以下の例では、分類Cのフィールドを <div style="color:red">Pleasanter</div> で置き換えます。

context.AddResponse('ReplaceAll','#Results_ClassCField','<div class="field-normal" style="color:red">Pleasanter</div>');

使用例②

以下の例では、フォーム($p.data.MainForm)に以下の情報を格納します。

格納する情報

項目 値
数値A項目 123
context.AddResponse('Set','NumA',123);

使用例③

以下の例では、作成後にサイトID1234のテーブルに遷移します。

context.AddResponse('Href','','/items/1234/index');

サンプルコード

1. テーブル内に期限切れレコードが存在した場合、ガイド欄にアナウンスを表示する

ReplaceAllメソッドでガイド欄の文言を動的に置き換えるサンプルコードです。

実務での使いどころ

期限切れのタスクや問い合わせが残っていることを、一覧を開いた人に必ず気づかせたいときに使えます。対象のレコードへのリンクも表示するので、そのまま対応に移れます。

期限付きテーブルの一覧表示時に、期限切れのレコードを取得、1件でも期限切れレコードがあった場合、ガイド欄の内容をReplaceAllメソッドで置き換えます。

期限切れレコードが存在する場合、以下のようにガイド欄に文言とリンクが表示されます。

ガイド欄に期限切れを知らせる文言とリンクが表示された状態

注意事項

本サンプルはバージョン1.5.0.0以降に対応しています。

CSS

以下スタイルを設定することで、ガイド欄の文字色を赤にします。

1
2
3
.md-viewer * {
    color: red !important;
}

JavaScript

条件:画面表示の前

コードの途中で return を使っているため、サーバスクリプトの「関数化」を有効にしてください。

// 一覧画面(index)のときだけ動作
if (context.Action !== 'index') return;
// 文字列をHTMLとして差し込むため、最低限のエスケープ
const escapeHtml = (s) =>
    String(s ?? '').replace(
        /[&<>"']/g,
        (c) =>
            ({
                '&': '&amp;',
                '<': '&lt;',
                '>': '&gt;',
                '"': '&quot;',
                "'": '&#39;',
            })[c],
    );
// /items/<id>... の <id> 以降を落として /items/ で終わるURLを作る
const getItemsBaseUrl = () => {
    const url = String(context.Url ?? '');
    const m = url.match(/^(.*?\/items\/)/);
    return m ? m[1] : '';
};
// 期限切れ(Overdue)のレコードを取得
const getOverdueItems = () => {
    const param = {
        View: { Overdue: true, ColumnSorterHash: { IssueId: 'asc' } },
    };
    return Array.from(items.Get(context.SiteId, JSON.stringify(param)));
};
// main処理
// 期限切れレコードを取得
const overdueItems = getOverdueItems();
// 期限切れレコードがなければ終了
if (overdueItems.length === 0) return;
// ベースURLを生成
const baseUrl = getItemsBaseUrl();
// 期限切れレコードのリンク一覧HTMLを生成
const linksText = overdueItems
    .map((item) => {
        const id = item.IssueId;
        const title = escapeHtml(item.Title);
        return `- ### [${title}](${baseUrl}${id})`;
    })
    .join('\n');
const guideText = `
[md]
# 期限切れのアイテムがあります。至急確認してください。
## 対象レコード
${linksText}
`;
// ガイドエリア用のHTMLを生成
const html = `
<div id="Guide">
    <div>
        <markdown-field class="is-disabled">
            <textarea class="md-text" id="guide-textarea" data-readonly="1">${guideText}</textarea>
        </markdown-field>
    </div>
</div>
`;
// ガイドエリア(#Guide)を差し替え
context.AddResponse('ReplaceAll', '#Guide', html);
2. 案件を開いたとき、同じ取引先のほかの未完了の案件を画面の上部に出す

案件のレコードを開いたとき、同じ取引先のほかの未完了の案件をitems.Getで探し、件数とリンクの一覧をcontext.AddResponseで画面の上部(ガイドの欄)に出します。

実務での使いどころ

営業・保守・問い合わせの台帳で、取引先から連絡を受けて案件を開いたとき、同じ取引先で動いているほかの案件に気付けるようにしたいときに使えます。一覧で取引先を絞り込めば同じことは分かりますが、案件を開くたびに一覧へ戻って絞り込む必要があります。

事前準備

1:「案件管理」テーブル(記録テーブル)で、以下の項目を有効化してください。

項目コード 内容
分類A(ClassA) 取引先。選択肢一覧に取引先を設定する(取引先のテーブルへのリンクでもよい)

2:スクリプトを登録します。

2-1:「テーブルの管理 > サーバスクリプト」タブで「新規作成」を選択する。
 2-2:タイトル: 任意の名前(例:showOpenCasesOfClient)
 2-3:スクリプト: 下記サンプルコードを貼り付け
 2-4:条件: 「画面表示の前」にチェック

JavaScript

条件:画面表示の前

// 取引先の項目(選択肢から選ぶ分類項目)と、「完了」の状況の値
const CLIENT_COLUMN = 'ClassA';
const COMPLETED_STATUS = 900;

const escapeHtml = (s) =>
    String(s ?? '').replace(/[&<>"']/g, (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' })[c]);

// 案件を開いたとき、同じ取引先のほかの未完了の案件を、画面の上部(ガイドの欄)に一覧で出す
function showOpenCasesOfClient() {
    if (context.Action !== 'edit' || !model[CLIENT_COLUMN]) {
        return;
    }
    const filter = {};
    filter[CLIENT_COLUMN] = JSON.stringify([String(model[CLIENT_COLUMN])]);
    const view = { View: { ColumnFilterHash: filter, ColumnSorterHash: { UpdatedTime: 'desc' } } };
    const others = Array.from(items.Get(context.SiteId, JSON.stringify(view)))
        .filter(item => item.ResultId !== model.ResultId && Number(item.Status) < COMPLETED_STATUS);
    if (others.length === 0) {
        return;
    }
    const links = others
        .map(item => `<li><a href="${context.ApplicationPath}items/${item.ResultId}">${escapeHtml(item.Title)}</a></li>`)
        .join('');
    // Pleasanter の class="message" などは使わず、独自のスタイルで出す(画面下部に固定されないように)
    const html = `<div id="Guide"><div style="border:1px solid #e0b000;background:#fff8e0;padding:8px 12px;margin:8px 0;">` +
        `同じ取引先の未完了の案件が${others.length}件あります。<ul style="margin:4px 0 0 20px;">${links}</ul></div></div>`;
    context.AddResponse('ReplaceAll', '#Guide', html);
}

showOpenCasesOfClient();

注記

  • 未完了は、状況の値が完了(900)より小さい案件です。開いている案件自身は出しません。
  • 取引先は、選択肢から選ぶ分類項目にしてください。自由に入力する分類項目では、取引先の絞り込みが合いません。
  • 表示の枠にはclass="message"を使っていません。このクラス名を使うと、画面の下部に固定して表示されます。

関連情報