プリザンターのスクリプト機能を使い、マニュアルにあるサンプルコードから実際に動かしてみた

はじめに

サンプルコードを見ても、よくわからないときありますよね。それに、何をどこに記述すればよいのかもわからないときは困ります。私はいつもシンプルなコードを作って、どのような値が返ってきて、どうすれば想定通りの動きをするのか試しています。私が研修中にサンプルコードでは少しわかりにくいかもなと思ったスクリプトや業務でこのスクリプトは結構使えるかもと思ったものをご紹介したいと思います。
※ここでご紹介する例はすべて動作検証済みです。そのため、環境が同じであればコピペですぐ動きます。ご利用の際はお客様の環境に合わせてご利用ください。

$p.getControl(項目名)

こちらは項目の要素をとってきてくれるスクリプトです。とても便利なので、一度使ってみてください。

$p.getControl('ClassA');

→分類Aの要素を取得します
また、上記のスクリプトに「.val()」をつけることでその要素の値を取得することができます。

$p.getControl('ClassA').val();

→分類Aに入力されている値を取得します

$p.set(変更対象の要素, その要素に入れたい値)

こちらは第一引数に変更対象の要素を指定し、第二引数にその要素に入れたい値を指定します。

$p.set($p.getControl('Title'), '頑張ろう')

→タイトルを頑張ろうに変更します

$p.on(イベント名, 監視項目, 任意の処理)

こちらは上記2つよりも難しいです。正直私も最初につまずきました。しかし、このスクリプトはとても便利です。実際に私がサポートしていく中で、このスクリプトはぴか一で便利だと実感しました。今回はその業務で利用したような方法をに近い形で記載いします。

$p.on('change', 'DateA', function () {
    $p.set($p.getControl('DateB'), $p.getControl('DateA').val());
})

→日付Aが変更されたとき、日付Bに日付Aの日付を転記する
こちらは上記2つと合わせるとすごく便利です。
また、$p.onの第一引数を変えることでどのようなときに処理が続行されるのか調整できます。

$p.on('click', 'checkA', function () {
    $p.set($p.getControl('ClassA'), 'こんにちは');
})

→チェックAがクリックされたとき、分類Aにこんにちはと記載する
こちらも考え方は同じです。ですが、イベントとは何でしょうか。マニュアルでは、Ajaxのイベント名と記載があります。そのため、調べてみたのですが、下記資料を参考にしてください。

こちらの記事では、「onchange」など頭文字に「on」がついていますが、上記のように「on」は不要なのかもしれません。私が試したのは「change」と「click」の2つでした。そのほかはまだ検証していないため、これから検証していこうと思います。