g_form alternative to DOM manipulation

[Shane Haverkamp]

Hello,

I'm trying to find a way to set a field's text color red and display an image to the left of the field's label. I am aware you can use DOM manipulation to do such thing similar to how VIP is displayed in incident, but can you get the same or similar result using g_form or any other ServiceNow tools?

[Community Alums]

Hi @Shane Haverkamp ,

g_form provides various methods for interacting with form elements, it doesn't directly support changing styles or inserting images. You'll need to use a combination of client scripts and possibly CSS for styling.

Please follow the below configuration-

function onLoad() {
    // Change the text color of a field
    var fieldLabel = document.querySelector('label[for="incident.number"]');
    if (fieldLabel) {
        fieldLabel.style.color = "red";  // Change text color to red

        // Add an image to the left of the field label
        var img = document.createElement("img");
        img.src="10starton.png"; // URL of the image
        img.style.marginRight = "4px"; // Add some space between the image and the label text
        img.style.verticalAlign = "middle"; // Align the image

        // Insert the image before the label text
        fieldLabel.insertBefore(img, fieldLabel.firstChild);
    }
}

 Note: Isolate script should not not be checked.

After configuration the result will look like:

If my response has resolved your query, please consider giving it a thumbs up ‌‌ and marking it as the correct answer‌‌!

Thanks & Regards,

Sanjay Kumar