Field Styles - Comparing two decimal values on a record

Jamsta1912
Tera Guru

Hello all,

I'm having some trouble with field styles.
I have two fields on a table, both of type 'Decimal'. I would like 'u_my_field1' to have a light green background on the form if it has a value less than or equal to that in 'u_my_field2'.

I've created a field style with this condition (value):

javascript: parseFloat(current.getValue('u_my_field1')) <= parseFloat(current.getValue('u_my_field2'))

I'm looking at an example record where 'u_my_field1' = 2.2, and 'u_my_field2' = 15.78, but the value is not being returned as TRUE (or at least, the field style is not showing). If I remove the condition (value) from the Field Style completely, the field style does show on the field on the form (ie the background is light green). Any thoughts on this?

 

1 ACCEPTED SOLUTION

On Form, the field styles dont work. They are for the list views. You need to write an onLoad or onChange client script to make this possible.

OOB, SN has used an onChange client script to highlight a caller as VIP on the Form. This is implemented by a client script named "Highlight VIP Caller".

Here is its link

https://instance_name.service-now.com/nav_to.do?uri=sys_script_client.do?sys_id=8f0b3ee00a0a0b5700e75f4aaabe4953

Replace instance_name with yours.

You need to create a similar client script for your logic. Sample script i have added here for your case, it may need modifications according to your styles and requirement.

function onLoad(){

//Replace field_name at where you need to display this icon
var Label = $('label.incident.field_name').down('label');  
var Field = $('sys_display.incident.field_name');
if (!Label || !Field)
  return;
}

if(parseFloat(g_form.getValue("u_my_field1")) <= parseFloat(g_form.getValue("u_my_field2")){

 var bgPosition = "95% 55%";
 if (document.documentElement.getAttribute('data-doctype') == 'true')
  bgPosition = "5% 45%";

//Apply your required CSS here - This is a sample one
 Label.setStyle({backgroundImage: "url(images/icons/vip.gif)", backgroundRepeat: "no-repeat", backgroundPosition: bgPosition, paddingLeft: '30px' });
 Field.setStyle({color: "red"});
} else {
//Reset CSS if condition fails
 Label.setStyle({backgroundImage: ""});
 Field.setStyle({color: ""});
}
}

 

View solution in original post

8 REPLIES 8

Are you trying to do this on a list view or a form? I see you have mentioned form initially.

Yes I'm trying to do this on a form.

On Form, the field styles dont work. They are for the list views. You need to write an onLoad or onChange client script to make this possible.

OOB, SN has used an onChange client script to highlight a caller as VIP on the Form. This is implemented by a client script named "Highlight VIP Caller".

Here is its link

https://instance_name.service-now.com/nav_to.do?uri=sys_script_client.do?sys_id=8f0b3ee00a0a0b5700e75f4aaabe4953

Replace instance_name with yours.

You need to create a similar client script for your logic. Sample script i have added here for your case, it may need modifications according to your styles and requirement.

function onLoad(){

//Replace field_name at where you need to display this icon
var Label = $('label.incident.field_name').down('label');  
var Field = $('sys_display.incident.field_name');
if (!Label || !Field)
  return;
}

if(parseFloat(g_form.getValue("u_my_field1")) <= parseFloat(g_form.getValue("u_my_field2")){

 var bgPosition = "95% 55%";
 if (document.documentElement.getAttribute('data-doctype') == 'true')
  bgPosition = "5% 45%";

//Apply your required CSS here - This is a sample one
 Label.setStyle({backgroundImage: "url(images/icons/vip.gif)", backgroundRepeat: "no-repeat", backgroundPosition: bgPosition, paddingLeft: '30px' });
 Field.setStyle({color: "red"});
} else {
//Reset CSS if condition fails
 Label.setStyle({backgroundImage: ""});
 Field.setStyle({color: ""});
}
}

 

Ah, I see! Thank you for this detailed answer.

Jamie