Formidable Forms makes it easy to perform calculations using values entered in your form. You may perform basic numeric calculations, separate value numeric calculations, or text calculations in a calculated field. Since Formidable is also a WordPress calculator plugin, you've got all the powerful and flexible options available for any project.
Numeric calculations
If you would like a calculated fields form with numeric values shown in the form, follow the directions below.
- Go into edit your form.
- Add a Number field to calculate the total. Set it to Read Only if you would like users to see, but not edit, the total.
If you do not want users to see the total, set the Visibility to 'Administrator'. - In the Advanced section for the total field, select the calculator icon in the Default Value section and click the menu icon to open up the Calculate the Default Value settings.
- Use the Field List search box to find the fields that you want to include in your calculation. You can use the field ID or key synonymously in a calculation. Your calculation might look something like: [25]+[26]+[27] or ([25]*8)+([27]/2). In the example below, two Number fields are multiplied:
- Enter the number of decimal places for your total.
- The total will be updated each time a field that is used in your calculation is changed.
You can use the total field value in your success message, email, or View. If you would like your users to make a payment with this total, you can pass the total amount to Paypal or Stripe.
Separate value calculations
Follow the directions below if you would like to setup a calculation where the value used in a calculation is not seen by the user. For example, if you have a radio button field with two options (Gold, Silver), then the text must be converted to numbers before calculating the total.
Note: Only use these instructions if the Pricing fields don't meet your needs.
- Go into edit your form.
- Check Use separate values for each field that will be used in your calculation (this can be found in the Field Options for Dropdown, Radio Button, and Checkbox fields).
- Add the number that will be used in your calculation to the end of each saved value. The calculation will only use numbers and decimals from the end of each saved value. Any other text or numbers before this will be ignored.
Please note that the saved value cannot be identical to any other saved value. If you have saved values that must have the same numeric value, they need to be entered like this: Gold - $25.00, Silver - $25.00. - Add a Number field to calculate the total. Set it to Read Only if you would like users to see, but not edit, the total.
If you do not want users to see the total at all, set the Visibility to 'Administrator'. - In the field options, select the calculator icon in the Default Value section. Click the menu icon to open up the Calculate the Default Value settings.
- Use the Field List search box to find the fields you want to include in your calculation. You can use the field ID or key synonymously in a calculation. Your calculation might look something like: [25]+[26]+[27] or ([25]*8)+([27]/2). In the example below, we are simply adding two fields together:
- Enter the number of decimal places for your total.
- The total will be updated each time a field that is used in your calculation is changed.
Text calculations
If you would like to combine text from multiple fields into a single field in your form, you may use Formidable's text calculations. Follow the directions below to concatenate multiple field values into a text field.
- Go into edit your form.
- Add a Single Line Text field to your form. This field will contain the combined text.
- Expand the Advanced field options and select the calculator icon in the Default Value section. Click the menu icon to open up the Calculate the Default Value settings and select Text in the toggle.
- Use the Field List search box to find the fields that you want to include in your calculation. You can use the field ID or key synonymously in a calculation. Any spaces or characters used in this box will show in the final value.
If you have enabled separate values and would like to retrieve the label of radio, checkbox, and dropdown fields, you can use the [x show="label"] shortcode option.
- Save your form and preview it. The value will be updated each time a field that is used in your calculation is changed.
Display subfields of name
If you have a name field, you can use [x show=first], [x show=middle], or [x show=last] shortcode options to display specific data. For example, follow the instructions below if you only want to show the first name in the calculated field.
- Add a name field.
- In the field options, set up a text calculation. Insert [x show="first"] in the Default value (Calculation) box. Replace x with the ID of your name field.
- The calculated value will be automatically updated when the first name data is entered in the Name field.
Currency calculations
Any calculated value can be shown as a read-only result, formatted as currency. Take a look at the example below from our car payment calculator.
To set up similar calculations, follow the steps below.
- Go to the Formidable → Global Settings and select the currency you would like to use.
- Add a field to your form and set it to calculate a result.
- In the calculation settings, check the box to Format calculation as currency. Checking this box will automatically hide the input box for the field and show the formatted result in its place.
- (Optional) The currency format adds two decimal places to the value by default. If you want to use a custom thousand/decimal separator, set the number of decimal places, or add a symbol, select the Use custom currency format checkbox.
Display calculated currency
Display the calculated values as currency when it is displayed in summaries, emails, entry listing page, views and more.
- Display value: When a calculated value is displayed, it will be formatted as currency.
[x]
Replace x with the ID or key of the calculated field.
- Format number: Prevents the currency formatting added to the calculated value.
[x format=number]
Replace x with the field ID or key of the calculated field.
Calculate sales tax
If you need to add sales tax to a total amount, follow the instructions below.
- Add a number field
- In the field options, set up a field calculation. Set up the calculation to use 2 decimal places.
- In the Default Value box, insert
[x] * 0.065
Where x is the Subtotal field ID, and 0.065 is equivalent to 6.5% sales tax.
- Add another field that adds the tax to the subtotal and displays the new total.
Calculate a user's age
Pro tip: Use our Age calculator template we have already built for you.
If you would like to calculate a user's age (in years) when they enter their date of birth, follow the instructions below.
- Add a Date field to your form. This will be the 'Date of birth' field.
- Add a Number field to your form and title it 'Age'. This is the field where the age will be calculated.
- If you want the user to see the age, select Read Only.
If you do not want the user to see the 'Age' field, then set the field Visibility to 'Administrator'. - In the field options, select the calculator icon in the Default Value section. Insert this calculation into the box:
[age id=25]
Replace '25' with the ID or key of your 'Date of birth' field.
- If you want the user to see the age, select Read Only.
- Now when the user inserts their birthday, the age will show up in the 'Age' field.
Note: Make sure nothing is entered in the "decimal places" area in Field Calculations when calculating an age.
If you would like to show the current age in a View, use the date field instead of a calculation so it will always be up to date. Follow the instructions on how to show an age in real time.
Calculate time between dates
Date calculations can be added to a form with at least two date fields. If you would like to calculate the number of days between two dates, follow the instructions below.
If only one date field is included in the form, date calculations can be displayed after the form is submitted. Read more on adding time to dates.
- Add a Date field to your form and title it 'Date 1'. Go to Field settings → Field Key and set the value to 'date1'. This will be your starting date field.
- Add another Date field to your form and title it 'Date 2'. Go to Field settings → Field Key and set the value to 'date2'. This will be your end date field.
- Add a Number field to your form and title it 'Number of Days'. This is the field where the number of days will be calculated.
- If you want the user to see the 'Number of Days' field, select Read Only.
If you do not want the user to see the 'Number of Days' field, set the field Visibility to 'Administrator' in your field settings.
- In the field options, select the calculator icon in the Default Value section. Insert this calculation into the default value box:
[date2]-[date1]
Or you could use the Field List search box to find the fields to include in your calculation. Click the menu icon to open up the Calculate the Default Value settings. You can use the field ID or key synonymously in a calculation.
- If you want the user to see the 'Number of Days' field, select Read Only.
- As a result, when the user selects their chosen dates, the number of days between those two dates will be displayed in the 'Number of Days' calculated field.
Get the total of the values of a Repeater
If you are using calculations in a repeater, follow the instructions on how to get the total of the values in a field in a repeater.
Unique calculated field combination
Do you need the combination of two fields to be unique? There is a custom code route, but it's possible you may be able to do this without custom code.
- Add a hidden field to your form.
- Check the 'Unique' box and customize the unique error message for this field.
- In the field options, select the calculator icon in the Default Value section. Click the menu icon to open up the Calculate the Default Value settings and select Text in the toggle.
- Insert a calculation that includes the two fields. So if you are limiting the form to one user per date, include the user ID and date fields in the calculation. It would work the best to include a dash between the two field values like [25]-[26].
- This will work best if both of the fields used in the calculation are required. Now when a logged in user tries to select and submit a date they already submitted, your unique message for the hidden calculated field will be displayed.
Number Format
- If you would like to round your total to two decimal places, enter 2 in the 'decimal places' box.
- To round the total to the nearest whole number, enter 0 in the 'decimal places' box.
- If you would like to add two decimal places in a single calculated field by default, enter 2 in the 'decimal places' box and [x] in the calculations box (where x is the field ID/key).
- If you would like to add a dollar sign in front of your number, go into your form and click on 'Settings' → 'Customize HTML'. Find the box that corresponds to the calculated field holding the number. Put a dollar sign in front of [input].
If the dollar sign appears above the calculated field, you need to decrease the field size.
Conditional calculations
To conditionally perform calculations using values entered in your form, you can use the ternary operator in calculated fields. Read more on how to use conditional calculations.
Advanced numeric calculations
- If you want to add exponents to an equation, you can use Math.pow():
Math.pow([x],2)
Replace x with a field ID for the base and replace 2 with the exponent amount.
- For more advanced calculations, such as minimums, maximums, and square roots, see the JavaScript Math object.
- If you want to generate a random number, you can use Math.random().
Math.floor(Math.random() * (9999 - 0001) + 0001)
This example will return a four-digit random number.
- If you want to return the highest value, you can use Math.max():
Math.max([x], 200)
Replace x with a field ID or key for the entered number, and replace 200 with the number you want to compare.
- If you want to return the lowest value, you can use Math.min():
Math.min([x],200)
Replace x with a field ID or key for the entered number, and replace 200 with the number you want to compare.
- To round a number down to its nearest integer, add Math.floor to the beginning of your calculation.
Math.floor([25]+[26]+[27])
- To round a number up to its nearest integer, add Math.ceil to the beginning of your calculation.
Math.ceil([25]+[26]+[27])