Total

Total Element General Overview

Using the Total element, you can build any formula for your Calculator. For that, you should add available Fields and Operators via clicking on them.

The Total element contains the following attributes:

  • Total Description - Give the description of the total calculation

  • Calculator Formula area - Create your own formula for the calculator

  • Available Fields - This field contains all elements of the created calculator form with their ordered IDs.

  • Available Operators - This field contains mathematical operators and functions that can be used in the formula

Available Operators

In the available operators' section, you can see mathematic operations like addition (+), subtraction (-), division (/), multiplication (*), percentage (%), and mathematical methods which will be listed below:

  • round(x) - returns the value of x rounded to its nearest integer: round(4.7)=5

  • pow(x,y) - returns the value of x to the power of y: pow(8, 2)=64

  • sqrt(x) - returns the square root of x: sqrt(25)=5

  • abs(x) - returns the absolute (positive) value of x: abs(-3.7)=3.7

  • ceil(x) - returns the value of x rounded up to its nearest integer: ceil(4.4)=5

  • floor(x) - returns the value of x rounded down to its nearest integer: floor(8.7)=7

You can review the mathematical methods here to get more information. Note: All these methods are written with a Math prefix since they are objects inherited from the Math library.

Please create a correct formula in Total element paying attention to element field IDs, opening and closing paratheses in nested formulas in order not to face some wrong results in the calculation summary.

Let's see the example of the Total element:

The result of the Total element above:

Creating formulas in the total element using available operators and fields is not the only thing you can do with it. Thankfully, you can add any conditional Javascript code to the Calculator Formula Field. Below we will discuss this total element's feature more in-depth.

If/Else Statement

You can watch a tutorial about the custom conditions and how to use if/else statements.

It is possible to create an if/else statement in the Calculator formula field of the Total Element. Using if/else statements, you can handle some situations and set conditions.

According to your needs, you need to write a conditional statement in the format of JavaScript code. Please be informed that you are required to use correctly working code, i.e. copying any JavaScript code, and pasting it to the Calculator Formula field is not recommended.

Using any JavaScript script/code in the total formula may harm your website or break down your full calculator functionality. Hence, please test the code to make sure that it is totally correct (not the malware code) before pasting it directly to your calculator total element. However, we recommend using only the if/else conditional statement in the total formula field.

Now, let's see the Loan Calculator which is built with a quantity, two range buttons, and total elements as a sample example:

Here is the standard formula for calculating the loan amount:

And now we will create an if/else statement so that the total sum of a loan calculator should be higher than or equal to 500 like below:

Make sure that the code is in the JavaScript syntaxis, is always on a single line, and the structure of open as well as close brackets is correct.

Sample if/else Statement Formula

JavaScript
JavaScript
if (( range_field_id_1 / 1200 +
( range_field_id_1 /1200 ) /
( Math.pow( 1 + range_field_id_1 /1200,
range_field_id_2 ) - 1))
* quantity_field_id_0 > 500) {( range_field_id_1 / 1200 +
( range_field_id_1 /1200 ) /
( Math.pow( 1 + range_field_id_1 /1200,
range_field_id_2 ) - 1)) * quantity_field_id_0}else{ 500 }

So, according to the formula above, the loan amount will be always higher than or equal to 500. Please check the following pictures:

The result of if statement:

The result of else statement:

Alternative Symbol

The Alternative Symbol option is available in order to display multiple Total fields with different calculations and symbols.

The inserted symbol in the Alternate Symbol field takes precedence over the currency symbol in the Settings menu.

The Alternative Symbol is displayed after pasting the symbol to the appropriate field.

Outcome:

If you are using the currency symbol in the Alternative Symbol field and want to integrate the Calculator with WooCommerce, then you have to consider whether WooCommerce supports that currency.