Add two fields together and display total in a third field in Service Catalog

[Marcel H_]

I've got a requirement to display some information to the user on a service catalog form showing numerical values, and also doing some math on values to display some read only fields to show the user current and revised contract amounts.

I have one read only field pulling data from a reference value on the form (contract_amount), and then using this value added together with the user entry from another field (u_change_order_amount) to display in another read only field (revised_contract_total). Using the script below in an onChange catalog client script, adding fields together works fine:

function onChange(control, oldValue, newValue, isLoading) {
   if (isLoading || newValue == '') {
      return;
   }

   //Add current contract amount and change order amount to get revised contract total
	var co = g_form.getValue('u_change_order_amount');
	var ca = g_form.getValue('contract_amount');
	var total = parseInt(ca) + parseInt(co);
	g_form.setValue('revised_contract_total', total);  
}

(please ignore the form layout, still in dev 🙂 )

However part of the issue is that I need to display the values in a format that looks more like currency (I wish there was a currency type field in service catalog) so that it is easier to read and catch typos. I've used a script on other catalog variables that don't require math to format them in the past, but that causes issues adding the fields together in this case

Formatting Script (removes $ as this causes issues when mapping to a currency field on a record):

function onChange(control, oldValue, newValue, isLoading, isTemplate) {  
  
  if (isLoading || newValue === '') {  
  return;  
  }  

//Format entered data
  var result = formatNumber(newValue);  
	if(result.search("$")){
		//alert("The value for Contract Amount must be in the format of xxxx.xx");
	result = result.replace("$","");
  }  
   
// To avoid recusrion 
   if (result != newValue) {
	g_form.setValue('u_change_order_amount', result);
      }	
}  

 function formatNumber(x) {  
// Regular expression allowing only numeric values  
  var reg = /^[\d,$.-]+$/;  
  if(!x.match(reg))  
    return false;  
  else  
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");  // Insert commas at correct position  

I think that if fields are formatted like this, part of the script doing the math would need to strip out any commas, perform the addition, and then a formatting script like this would reformat it with commas inserted again for readability. I'd also prefer to change my formatting script to display two decimal places, and I've tried using .toFixed(2) but have never gotten it to work quite right.

Has anyone had issues like this and been able to make variables perform more like a currency field in service catalog?

[Mohit Kaushik · Accepted solution]

Hi There,

Try to use the below code in your client script. This might solve the issue you have.

var co = g_form.getValue('u_change_order_amount');
var newCo=co.replace(/\,/g,"");
var ca = g_form.getValue('contract_amount');
var newCa= ca.replace(/\,/g,"");
var total = parseInt(newCo) + parseInt(newCa);

g_form.setValue('revised_contract_total', total.toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ","));

Please mark this answer as correct and helpful if it resolve the query or if it helped you to lead
into right direction then mark it helpful alone.


Thanks,
Mohit Kaushik

[Marcel H_]

Thanks a lot. This has gotten me really close to the desired result. The script I ended up with was:

function onChange(control, oldValue, newValue, isLoading) {
   if (isLoading || newValue == '') {
      return;
   }

   //Type appropriate comment here, and begin script below
	var co = g_form.getValue('u_change_order_amount');
	var newCo = co.replace(/,/g,"");
	var ca = g_form.getValue('contract_amount');
	var newCa = ca.replace(/,/g,"");
	var total = parseInt(newCo) + parseInt(newCa);
	total = total.toString();
	g_form.setValue('revised_contract_total', total.replace(/\B(?=(\d{3})+(?!\d))/g, ","));
}

Now I just need to work out the best way to handle cases where a value with a decimal place is entered by the user (e.g. 200.25)

[Mohit Kaushik]

Hi Marcel,

you can do a little change in the script and this should work:

var total = (parseFloat(newCo) + parseFloat(newCa)).toFixed(2);

Let me know if you still face issues.

Thanks,

Mohit Kaushik

[Marcel H_]

Perfect, this is exactly what I needed to get the exact result I needed. Thanks!