Adding two number fields together with script (outside repeat)

Using the Logic Tab

The value of two number fields can be added together by copying the following script into the Logic Tab for the field you want to set the value of; for example FIELD_1004. The calculation will be performed each time the value in either field is changed.

Under 'Trigger' select 'Javascript' and add the following code in the box:

result = true;

Under 'Action' select 'Value' and add the following code in the box:

var val1 = isNaN(parseInt(data.FIELD_1002)) ? 0 : parseInt(data.FIELD_1002);
var val2 = isNaN(parseInt(data.FIELD_1003)) ? 0 : parseInt(data.FIELD_1003);
value = val1 + val2;

The parseInt() function turns a ‘string’ into a ‘number’ so that it can be used in a mathematical equation.

The isNaN() function returns true or false based on whether it's argument is 'not a number' or not. The expressions here will set the variables to zero if the field they are checking for is not a number, and will set the variables to the value of the field if that is not the case.

The value variable is how we assign the value for this field.

Using a common ‘function’

The value of two number fields can be added together using the following common script function:

function dosum(){
    var val1 = parseInt(Form.data.FIELD_1002) || 0;
    var val2 = parseInt(Form.data.FIELD_1003) || 0;
    var sum = val1 + val2;
    if( $('.formio-component-FIELD_1004') ) {$(form).setVal('FIELD_1004', sum)}    
    Form.data.FIELD_1004 = sum;
}

What this script is saying is: if the field is a number (i.e. an integer), then use the number ‘OR’ (i.e. ||) if the field is not an integer or is empty, then use the number ‘0’. This ensures that the add function works.

Another way of doing exactly the same thing would be to use the following function:

function dosum(){
    var val1 = isNaN(parseInt(Form.data.FIELD_1002)) ? 0 : parseInt(Form.data.FIELD_1002);
    var val2 = isNaN(parseInt(Form.data.FIELD_1003)) ? 0 : parseInt(Form.data.FIELD_1003);
    var sum = val1 + val2; 
    if( $('.formio-component-FIELD_1004') ) {$(form).setVal('FIELD_1004', sum)}
    Form.data.FIELD_1004 = sum; 
}

The isNan() functions tests to see if the field values are ‘not-a-number’. If the field is not a number, then it is assigned the value of ‘0’, otherwise the integer value is used.

The parseInt() function turns a ‘string’ into a ‘number’ so that it can be used in a mathematical equation.

You need to copy this script function into the Script Editor for your form. This is the best place to put a function so that it can be used by a number of fields within your form.

You then need to set the function to run when those fields change by adding the following lines of code to the Script Editor:

$('.formio-component-FIELD_1002').find('input').change(function() { doSum() })
$('.formio-component-FIELD_1003').find('input').change(function() { doSum() })

Adding fields within a repeat table

If you want to add numbers within a repeating table with script, then read this article.