How to hide annotation using client script for scoped application

[Karishma Dubey]

Hi Team,

I was trying to hide annotation for specific related service. However, it is not working. Please suggest. Related services is a reference field. Isolate script is false and UI type = "All"

//onload client scipt

  var rel_services = g_form.getReference('related_service').toString();

    //getValue('related_service');

    alert(rel_services);

     if (rel_services == "67a3e8301b8c62d00b9a11739b4bcba2") {

         info1.style.display = 'block';

     }

     else{

        info1.style.display = 'none';

     }

[TheCung]

Hope this helps

// onload client script

window.onload = function () {

    // Get the related service reference

    var rel_services = g_form.getReference('related_service').toString();

    // Get the element with ID 'info1'

    var info1 = document.getElementById('info1'); // Replace 'info1' with the actual ID

    // Ensure the element exists before manipulating it

    if (info1) {

        if (rel_services === "67a3e8301b8c62d00b9a11739b4bcba2") {

            info1.style.display = 'block';

        } else {

            info1.style.display = 'none';

        }

    } else {

        console.error("Element with ID 'info1' not found.");

    }

};

[Chaitanya ILCR]

Hi @Karishma Dubey ,

Try this with isolate script as false

function onLoad() {
    $('info1').up().hide();
    var rel_services = g_form.getValue('related_service');
    alert(rel_services);
    if (rel_services == "67a3e8301b8c62d00b9a11739b4bcba2") {
        $('info1').up().show();

    }
}

is related_service field available on the form?

if no

create a display BR with 

g_scratchpad.relatedService = current.getValue('related_service')

client script with isolate script false

function onLoad() {

    $('info1').up().hide();
    if (g_scratchpad.relatedService == "67a3e8301b8c62d00b9a11739b4bcba2")
        $('info1').up().show();

}

Please mark my answer as helpful/correct if it resolves your query.

Regards,
Chaitanya

[_ukasz Rybicki]

Analysis of answer

• DOM ID assumption: I assumed the <span id="info1"> ID won’t change; in reality it can vary per form or UI theme—inspect and confirm the ID first.

• Field value timing: I used g_form.getValue() synchronously, which works on form load, but if the field is populated via UI Policy or asynchronous script, you may need an onChange script or a short setTimeout.

• Alternative omission: I focused on client scripting and didn’t propose a UI Policy or UI Action approach, which can be no-code/OOTB for showing/hiding annotation fields.

• Isolate script: I didn’t explicitly remind to set Isolate Script = false so the script can access the DOM element.

---

Final Solution

Name of Problem

Hide InfoBox Blue annotation by related_service value

General proposal (≤100 words)

On an onLoad Client Script, read the sys_id from related_service via g_form.getValue(), locate the annotation <span> by document.getElementById(), and toggle its style.display. Ensure Isolate Script is disabled. 😊 (ServiceNow)

Detailed proposal (≤250 words)

1. Identify the annotation element

   • Inspect form HTML → confirm your <span id="info1">…</span> ID.

2. Create Client Script

   • Type: onLoad

   • Isolate Script: false

   • UI Type: All

3. Script code

   // onLoad Client Script
   function onLoad() {
     // 1. Get related_service sys_id
     var relId = g_form.getValue('related_service');
     // 2. Locate annotation span
     var infoEl = document.getElementById('info1');
     if (!infoEl) return; // nothing to do
     // 3. Toggle visibility
     if (relId === '67a3e8301b8c62d00b9a11739b4bcba2') {
       infoEl.style.display = '';    // show
     } else {
       infoEl.style.display = 'none';// hide
     }
   }

4. Alternative

   • Use a UI Policy on related_service with a Run Script action calling the same DOM logic.

5. Manual steps

   • Ensure the annotation is on the form via Form Designer > Annotations.

   • Confirm field name related_service.

   • Add the Client Script record and deploy.

Example solution (≤100 words)

A scoped onLoad Client Script on a Change Request form retrieves the selected related_service ID and hides a blue info box advising cost-entry rules unless the service matches a specific catalog item. This prevents clutter for non-applicable services. 😊

---

Sources

1. How to hide annotation using client script for scoped application (ServiceNow Community) – recommends g_form.getValue() and document.getElementById() for show/hide logic (ServiceNow).

2. Administering form annotations (ServiceNow Docs) – explains annotation HTML structure and the need to disable isolate script for DOM access (ServiceNow).

---

Please mark this as the correct answer!