Join the #BuildWithBuildAgent Challenge! Get recognized, earn exclusive swag, and inspire the ServiceNow Community with what you can build using Build Agent.  Join the Challenge.

Putting '?' icon next to the felid

MadhuDanalN
Tera Contributor

Hey guys I need a help with a customization in the SIR form. I have some fields in the form and the client want to put some hints and a interrogation icon next to the field "?". I managed to put the hint in the label configuration in the field but I can't put the icon next to him.

1 ACCEPTED SOLUTION

vignesh parthib
Tera Guru

Hi @MadhuDanalN 

You can try inject a DOM element dynamically .

But Direct DOM manipulation (document.querySelector etc.) is not officially supported or recommended in ServiceNow Client Scripts.

 

function onChange(control, oldValue, newValue, isLoading) {
if (isLoading) return;

// Remove existing icon
var existingIcon = document.querySelector('#impact-info-icon');
if (existingIcon) existingIcon.remove();

if (newValue == '2') { // Low
var icon = document.createElement('span');
icon.id = 'impact-info-icon';
icon.className = 'icon-help';
icon.style.marginLeft = '10px';
icon.style.cursor = 'pointer';
icon.title = 'Low impact: Issue affects one user or a minor function.'; // Tooltip text

var label = document.querySelector('label[for="impact"]');
if (label) label.appendChild(icon);
}
}

 

Thanks,
Vignesh
"If this solution resolves your issue, kindly mark it as correct."

View solution in original post

12 REPLIES 12

Hi @MadhuDanalN 

 

Let’s take an example — how many times does a user actually click on the “?” icon in a day when logging an incident just to change the priority?

If the user is completely new to the system, maybe 4–5 times a day at most. But for an experienced user, it’s likely close to zero — maybe once in a blue moon.

My main point here is to avoid introducing technical debt — and that’s what I’ve been trying to emphasize.

Also, even if a user does click on the “?”, they’ll just see a static message every time. You can achieve the same effect by displaying the message dynamically without requiring any extra clicks. It’s more seamless and improves the user experience.

*************************************************************************************************************
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
Dr. Atul G. - Learn N Grow Together
ServiceNow Techno - Functional Trainer
LinkedIn: https://www.linkedin.com/in/dratulgrover
YouTube: https://www.youtube.com/@LearnNGrowTogetherwithAtulG
Topmate: https://topmate.io/atul_grover_lng [ Connect for 1-1 Session]

****************************************************************************************************************

vignesh parthib
Tera Guru

Hi @MadhuDanalN 

You can try inject a DOM element dynamically .

But Direct DOM manipulation (document.querySelector etc.) is not officially supported or recommended in ServiceNow Client Scripts.

 

function onChange(control, oldValue, newValue, isLoading) {
if (isLoading) return;

// Remove existing icon
var existingIcon = document.querySelector('#impact-info-icon');
if (existingIcon) existingIcon.remove();

if (newValue == '2') { // Low
var icon = document.createElement('span');
icon.id = 'impact-info-icon';
icon.className = 'icon-help';
icon.style.marginLeft = '10px';
icon.style.cursor = 'pointer';
icon.title = 'Low impact: Issue affects one user or a minor function.'; // Tooltip text

var label = document.querySelector('label[for="impact"]');
if (label) label.appendChild(icon);
}
}

 

Thanks,
Vignesh
"If this solution resolves your issue, kindly mark it as correct."

MadhuDanalN
Tera Contributor

Thank you @vignesh parthib