Calculation Fields — Build Quote & Order Forms
Fillin Forge’s Calculation field does math in real time based on other fields in the same form. Build a quote estimator, an order form with automatic totals, a BMI calculator, or any other form that needs to compute a value from the numbers a visitor enters.
How calculation fields work
Reference other fields in formulas
In its field panel, a Calculation field has a Formula box where you write an expression with the other fields as placeholders in braces. Under Available tokens the panel shows, for each field of the form that can be read, a button with the field’s ID and a button with its label in lower case with underscores (a field labelled “Unit price” gives {unit_price}). Click a button to put that token into the Formula box. A token stands for the number in that field. Example:
{quantity} * {unit_price}When the user fills in the quantity and unit price fields, the calculation field updates to show the total. The calculation runs in the visitor’s browser each time an input or a dropdown of the form changes, so there is no “Calculate” button. Heading, HTML Block, Divider, Page Break, Hidden, File Upload, Repeater, Address (Map), Payment and Calculation fields have no token.
Supported operators
+addition-subtraction*multiplication/division( )parentheses for order of operations
No functions
A formula can hold numbers, tokens, +, -, *, / and parentheses, and nothing else. The panel’s own help says: “Use standard math operators: +, -, *, / and parentheses.” Before the formula is calculated, every other character is removed from it. So round, min, max, abs, sqrt and if do not work, and neither do %, comparisons or text in quotes; a formula that uses them can show a wrong number or leave the field unchanged. To round the result, use the Decimal places setting.
Changing the result with a checkbox
A formula has no if, but a checkbox can do the same job with arithmetic. A single checkbox (one without options) counts as 1 when it is ticked and as 0 when it is not, and a group of checkboxes adds up the numbers of the options that are ticked. A 20% discount for members looks like this:
{price} * (1 - 0.2 * {member})Here {price} is a number field and {member} is a single checkbox. Members pay 80% of the price, everyone else pays the full price.
Real-world examples
Pricing calculator
A service website lets users get a quote based on the hours of work and a rush option:
- Hours (number field)
- Rush job (a single checkbox: counts as 1 when ticked, 0 when not)
- Total (calculation:
{hours} * 80 * (1 + 0.5 * {rush_job}), with the prefix$)
The total updates live as the user types and ticks. A Radio or Dropdown option typed in the options box is read as a number only if its text starts with one: an option “1500” counts as 1500, but an option “Small $500” counts as 0. That is why this example prices by hours and not by a Small, Medium or Large choice.
Simple interest calculator
- Loan amount (number field)
- Interest rate (number field, percent per year)
- Loan term (number field, years)
- Interest (calculation:
{loan_amount} * {interest_rate} / 100 * {loan_term})
The panel offers only the four operators and parentheses and no functions, so this example uses simple interest.
BMI calculator
- Weight (number field, kg)
- Height (number field, cm)
- BMI (calculation:
{weight} / (({height} / 100) * ({height} / 100)), with Decimal places set to 1)
Order form with automatic totals
- Product A quantity (number)
- Product B quantity (number)
- Product C quantity (number)
- Total with 10% tax (calculation:
({product_a_quantity} * 10 + {product_b_quantity} * 25 + {product_c_quantity} * 50) * 1.1)
The token buttons do not list Calculation fields, so build each formula from the input fields, as above.
With a Payment (Stripe) field set to Dynamic (linked to Calculation), the visitor is charged the total shown at submit time (see Connection to Stripe payments below).
Event registration with dynamic pricing
- Number of tickets (number field)
- Early bird discount (a single checkbox: ticked takes 10% off)
- Total (calculation:
{number_of_tickets} * 50 * (1 - 0.1 * {early_bird_discount}))
Display options
Currency prefix and suffix
Every calculation field supports a prefix (e.g., $, €, £) and a suffix (e.g., USD, /month). The prefix and suffix are display-only; the value stored with the submission is the number without them.
Decimal precision
The Decimal places setting takes a number from 0 to 6. Useful for currency (2 decimals) vs percentages (1 decimal) vs whole-number counters. If you leave it empty, the result is rounded to two decimals and trailing zeros are not shown (12.5, not 12.50).
Number formatting
The result is shown as a plain number with a point as the decimal mark and no thousands separators: 1234.56.
Connection to Stripe payments
Calculation fields and Stripe payments work together. In the settings of the Payment (Stripe) field, choose Dynamic (linked to Calculation) and pick the calculation under Linked Calculation field. At submit time the visitor is charged the amount the Calculation field shows, as long as it is not below Stripe’s minimum (0.50 in USD, 50 in JPY) and not above the limit for one payment (1,000.00 in USD and the other currencies with hundredths, 100,000 in JPY); otherwise the payment is refused.
Real-time updates
Calculations update as the user types or makes selections. No “Calculate” button. No page refresh.
A field that is empty, or whose value does not start with a number, counts as 0. If a formula gives no finite number (a division by zero, for example) or cannot be read, the field keeps the value it showed before; at first that is 0, or 0.00 with two decimal places.
Ready to build a calculator form?
The calculation field is included in every paid plan.