Client script to change the background color of a field

Go to solution
AEterni
Mega Guru

‎11-08-2021 07:20 AM

Hello Team,

Requirement

Change the background color of a field in the incident/request item form when a specific condition is met.

The field we want to change is the "Company" field. The company field in the incident table is a reference to the core_company table

The condition (must be TRUE) is based on a field of the core_company table.

Actions taken

Checked other posts in the community forum. I have found this one that seems to seems to be the right for me.

  • Created a new "Client Scripts"
    • Table "Incident"
    • UI Type "Desktop"
    • Type onLoad
    • Script:
function onLoad() {
    //Type appropriate comment here, and begin script below
    var company = g_form.getElement('company');
    var gcn = g_form.getValue('core_company.u_global_corporate_network_firm');
    if (gcn == 'true') {
        company.style.backgroundColor = "red";
    }
}

It doesn't work not I get any error message when I load the incident form.

Can you please help?

Thanks.

0 Helpfuls
  • 8,173 Views
1 ACCEPTED SOLUTION

Go to solution
Simon Abildgaar
Tera Contributor

‎11-12-2021 03:38 AM

Hi, the reason the above client scripts will not work, is because company is a reference field. So when you use the g_form.getControl('company') the returned html element is a hidden input field and not the shown reference/lookup field, so adding styles to that will not do anything.
To get the correct visible field on the form, use g_form.getControl('sys_display.incident.company').

I will also suggest doing the script in an "onChange", as that will make it work dynamically when you change the value of the company field. An "onChange" script is also triggered "onLoad".

Below you can se a working implementation of an on change script for you problem.

function onChange(control, oldValue, newValue, isLoading, isTemplate) {
	var displayControl = g_form.getControl('sys_display.incident.company'); 
    if (newValue === '') {
        displayControl.style.background = '';
    } 
	else {
        g_form.getReference('company', callBack);
    }

    function callBack(ref) {
        if (ref.u_global_corporate_network_firm === 'true') {
            displayControl.style.background = 'red';
        } 
		else {
            displayControl.style.background = '';
        }
    }
}

View solution in original post

13 REPLIES 13

Go to solution
Ankur Bawiskar
Tera Patron
Tera Patron
In response to AEterni

‎11-08-2021 08:24 AM

Hi,

is company table having that field "u_global_corporate_network_firm"?

If yes then this should work in onLoad update script

I assume your company field is populated when form loads then only you can get the field value you want to check

Also update the field name here

function onLoad() {
    //Type appropriate comment here, and begin script below
    var ref = g_form.getReference('company', callBackMethod); // update field name here
}

function callBackMethod(ref){
    if (ref.u_global_corporate_network_firm.toString() == 'true') {
        var control = g_form.getControl('company');
        control.style.backgroundColor = "red";
    }
}

Regards
Ankur

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader
0 Helpfuls

Go to solution
AEterni
Mega Guru
In response to Ankur Bawiskar

‎11-12-2021 02:06 AM

@Ankur Bawiskar 

FYI - I logged a ticket with ServiceNow. They confirmed the script you suggested should work, but they also confirmed it is not working.

Pending feedback from the investigation.

0 Helpfuls

Go to solution
Ankur Bawiskar
Tera Patron
Tera Patron
In response to AEterni

‎11-12-2021 02:14 AM

Hi,

if the field is read-only the color doesn't get applied.

Is that the case with you?

Regards
Ankur

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader
0 Helpfuls

Go to solution
AEterni
Mega Guru
In response to Ankur Bawiskar

‎11-12-2021 02:22 AM

No it is not my case, but ServiceNow engineer also told me that he tried with a simpler version of the script and it doesn't work either.

0 Helpfuls

Go to solution
Ankur Bawiskar
Tera Patron
Tera Patron
In response to AEterni

‎11-12-2021 02:53 AM

Hi,

the above has worked for me in past.

Do share us the updates

Regards
Ankur

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader
0 Helpfuls