Ninja Forms 3.0 introduced Pricing Fields as default commerce options for you to use to handle simple transactions. Have a product you’re selling? Setting up your form is as simple as adding a product field, shipping if it’s needed, and a total field. Your payment gateway of choice takes the amount in the total field, process, done. Doesn’t get much more straightforward than that! While the pricing fields are a perfect solution for many, we know many more of you need more. That’s where Ninja Forms calculations come into play.

Using Ninja Forms calculations, you can take values from anywhere on your form, total it all out behind the scenes, display an amount for your customers, and send that amount through to your payment gateway of choice. It’s slightly more complex to set up a calculation, but it’s infinitely more powerful than the common pricing field alternative. Let’s walk through how to set up a form that demonstrates this now!

## Ninja Forms Calculations as a Commerce Option

Alright, let’s say that we want to sell something using a checkbox list field. We’ve gone into business selling Widgets, Gadgets, and Gizmos. Each of these handy items come in 3 different colors: red, green, and blue. Price is based on color, $10 for a Red, $15 for a Green, $20 for a Blue, regardless of type. Let’s take a gander at how to set this up.

### The Form Fields

We’re using checkbox list fields and number fields to handle the products and quantity selection as you can see below. You can alternatively use any combination of fields for your products that you wish as long as it has a calc value input in the settings. The HTML field is necessary for displaying the total for our customers.

### Setting Up the Calculation

In the image below, I’ve renamed our fields to reflect the products we’re selling. You can see to the left of the image the field settings for our Widget checkbox list. I’ve added the product choices Red, Green, and Blue as list item choices, and assigned them each a calc value that is equal to the dollar amount we’ll be charging for them.

Now we need to set up the calculation to pull in these values. Click on the Advanced tab of the form builder and then on Calculations. I’ve named the calculation ComCalc and, using the Merge Tag icon, added each of our product and quantity fields. I’ve then structured the calculation as an equation by adding the appropriate mathematical symbols between each field (+ – / *). For this calculation, we’re multiplying each product by its quantity and summing each: {field:gizmo_quantity}*{field:gizmos}+{field:gadget_quantity}*{field:gadgets}+{field:widget_quantity}*{field:widgets}.

Now that we have our calculation set up, let’s work on displaying it for our customers.

### Displaying the Calculation for Your Customers

This is where our HTML field comes in. Slide out the field settings window for it and see the Default Value option with the rich text editor. To bring your calculation value into this field for display, click the merge tag icon I’ve highlighted below and select your calculation from the list. As an aesthetic touch, I’ve used the rich text editor here to add “Total:” preceding the value display and turned all of that text into header 3.

### Bringing the Calculation into Your Payment Gateway

I’ve chosen Paypal for this form, but you may prefer Stripe for accepting credit card payments and setup for it is exactly the same. Click on the Emails & Actions tab of the form builder now and add a collect payment action from the list of available actions (Paypal or Stripe must be installed and activated). Slide open the settings window for the collect payment action and set Payment Gateways to Paypal Express. In the Payment Totals field, click the Merge Tags icon to the right and select the ComCalc calculation we set up above. You can see the finished action in the image below.

Paypal will now treat our calculation value as the total to process for payment!

### Our Form on the Front End

This is our completed form on the front end with several options selected to demonstrate that the calculation is indeed functioning:Sending the value of Ninja Forms calculations to a payment gateway is a technique that a lot of you have been requesting in your communications with us, and it’s something we’ve had in Ninja Forms v3.0 since its inception, but something that we haven’t done a good enough job of communicating. So, here it is! We hope it helps you make the most of your forms, and we’d love to hear or see examples of how you’re taking advantage of this functionality on your website! How are you using Ninja Forms? I’d love to hear from you!

Setting up a calculation to be sent to a payment gateway as a total in your Ninja Forms is easy!Click To Tweet
## nomita says:

Hi

i have added check box to describe my package and a drop down to select the no. of attendees but i want to give 10% discount if no. attendees is = 3

## Quay Morgan says:

Nomita,

Hey! Check out this article on adding coupon codes. You can use the same method with calculations and conditional statements described there, and just link the conditional statements to the number of attendees instead of a coupon code.

Cheers,

Quay

## Frank Schrijvers says:

Hello,

I’ve setup a form with calculations and now I want to send the final calculation value by e-mail to the administrator and in the succes message. How can I achieve that?

## Quay Morgan says:

Frank,

You ought to be able to do so using the merge tag for the calculation. {calc:calcname}, where calcname is whatever you named the individual calculation.

Cheers,

Quay

## Dan H says:

Hey there,

I’m building out a fairly complex form and Stripe’s use of calculations is bugging out. Where the equation in the variable is just taking the value of a number field it works fine, but doing a calculation with fields is causing major issues. The strange thing is, the equation is working perfectly because I can output the number to a HTML object, but the payments aren’t going through. Any help would be awesome! Thanks, Dan

## Dan H says:

All good, figured it out! For those playing along at home, if you’re using checklists or drop downs, MAKE SURE you add :calc at the end of the calculation. Native NF is smart enough to pick up the value, but the Stripe integration is not! Got me for hours this one.. eg {field:yourchecklist_123456789:calc}

## SC Tague says:

I manage a site for a client who is selling a book. I want to set up a volume discount, but am not sure how to proceed. Is there a way to do so or am I just chasing my tail?

## Quay Morgan says:

I believe this ought to be doable using Conditional Logic. Make yourself a subtotal field that receives the output of the calculation, and then set a conditional statement that applies only if the amount in that field is greater than x. If it is, multiply the total by .10 or whatever you wanted your discount to be (the discount value would have to be housed in a second field and the conditional statement, if triggered, would multiply the two fields together to reach a new total).

Make sense?