HTML Client Script for Displaying Caution Label in RITM Form - Need Help"

[Service now11]

Hi,

I’m trying to display a caution label at the top of an RITM form when the "Stage" field value is set to "waiting_for_approval". The goal is to ensure that the label appears at the top of the form so that users don’t accidentally fulfill or handle tickets that are not yet approved.

Requirements:

• Display a warning message at the top of the RITM form when the "Stage" field has the value "waiting_for_approval".
• Label content:
  CAUTION
  "Ticket is awaiting approval per defined flow. Do NOT fulfill/handle unless manual approval has been achieved."
• The label should have white text on a red background.
• "Stage" field label should also be highlighted in red.
• The label should only be shown when the "Stage" value is "Waiting for Approval"
• Also red dot flagging in list views

Issues I’ve Encountered: I tried using  .body and .polaris as possible selectors for the form’s main content, but I still don't see the label.

Client Script: 

function onLoad() {
var stage = g_form.getValue('stage');
if (stage == 'waiting_for_approval') { // Assuming internal value for "Waiting for Approval" is '1'
// Create and display the caution label at the top of the form
var cautionLabel = document.createElement('div');
cautionLabel.id = 'caution-label';
cautionLabel.style.backgroundColor = 'red';
cautionLabel.style.color = 'white';
cautionLabel.style.textAlign = 'center';
cautionLabel.style.padding = '10px';
cautionLabel.style.fontWeight = 'bold';
cautionLabel.innerText = 'CAUTION: Ticket is awaiting approval. Do NOT fulfill/handle unless approved manually!';

// Insert caution label at the top of the form's body section
var formBody = document.querySelector('.body'); 
if (formBody) {
formBody.insertBefore(cautionLabel, formBody.firstChild);
}

// Highlight the STAGE field label with a red background
var stageLabel = document.querySelector('label[for="stage"]');
if (stageLabel) {
stageLabel.style.backgroundColor = 'red';
stageLabel.style.color = 'white';
}
}
}

[tshruti496]

Hello @Service now11,

Can you try by using getDisplayBox

g_form.getDisplayBox('fieldname'). style == 'red';

If my response helped please mark it correct and close the thread so that it benefits future readers.

Regards
Shruti

[Simran Gadodiya]

Hello @Service now11 

1. You can try below mentioned onload client script for the message at the top(you can upate as per your fileds)

function onLoad() {

    //Type appropriate comment here, and begin script below

    var stage = g_form.getValue('stage');

    var message = '<div style="background-color:red;color:white">CAUTION :Ticket is awaiting approval per defined flow. Do NOT fulfill/handle unless manual approval has been achieved..<br/>';

    if (stage == 'waiting_for_approval') {

        g_form.addInfoMessage(message);

    }

}

2. For Red dot flagging in the list view you can try mentioned steps in the article.
https://www.servicenow.com/community/developer-blog/servicenow-admin-101-how-to-override-the-ui14-qu...

If my response proves useful, please indicate its helpfulness by selecting " Accept as Solution" and " Helpful." This action benefits both the community and me.

Regards,

Simran