UI Action
UI Actionとは、NowPlatform上でのボタンやリンクのことです。
これをトリガーとして、WorkflowやTaskの状態遷移に映るので、実装上必須です。
今回は、UI Actionを着色します。
完成イメージ
これを
こうします！
実装
1.client scriptの作成
system definition > client script に移動する。
client script テーブルのNewをクリックする。
name:change button color
table:incident
type:onLoad
script:
function onLoad() {
//resolve incidentボタンの色を変える
changeButtonColor('resolve_incident', '#f0f8ff');
//aaaaaaaaaボタンの色を変える
changeButtonColor('aaa', '#ffffe0');
}
//第一引数:buttonID=>UI ActionでのAction nameの値,を指定
//第二引数:カラーコードを指定
//カラーコード:https://www.colordic.org/
function changeButtonColor(buttonID, backgroundColor) {
try{
//buttonIDからbuttonを特定して 背景色を変更
$$('button[id=' + buttonID + ']').each(function(elmt) {
elmt.style.backgroundColor = backgroundColor;
elmt.style.color = '#ffffff'; //ボタンのテキスト色を変更
});
}catch(e){}
}
これで、クライアントスクリプトは実装OK
changeButtonColor()の第一引数である、UI ActionのAction nameは下記です！
2)client scriptのグローバル適用設定
クライアントスクリプトを書くだけでは実行されず、下記のinfo messageが表示されるため、もう一つ手順を踏む。
New client-scripts are run in strict mode, with direct DOM access disabled. Access to jQuery, prototype and the window object are likewise disabled. To disable this on a per-script basis, configure this form and add the "Isolate script" field. To disable this feature for all new globally-scoped client-side scripts set the system property "glide.script.block.client.globals" to false.
クライアントスクリプトの適用範囲をIsolate->Globalに変更してやる必要がある。
client script のリストレイアウトからIsolate scriptをtrue/falseで設定できるため、falseにする。
これで完成！下記のように！着色の仕方は応用が利くので様々な場面にてご利用ください。