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