Configuring a field that shows total cost before adding to cart?

I’m using
as my product configurator, so the code can be seen in the link .

I would like to have a text field that shows the total price, every time they pick that new “feature” to the product.

I know this doesn’t work but something like this:

for (var i = 0; i < selectedOptions.length; i++) {
var totalPrice= 0;
choiceData.price = choiceData.price + totalPrice;

Any help is greatly appreciated, thank you in advance!

You need to create different product options with different prices in your stores dashboard. Click here to learn how.

Based on the selection in your product configurator display the relevant price. When adding to the cart, you simply need to select the relevant product options based on the items chosen in the configurator. Click here to learn more.

Thanks for the reply. I don’t know if I was not explaining correctly.
I have a system that does that. And It works great, and shows the price at the cart when you go there. But I would like it so that the price shows up when they are configuring the product.

My website:


I have done my website off the product options, not separate products.

It would be shame to change it as it is a lot of work.

So could this be used?


It says that it is able to get the variants price.

type ProductOptionsAvailabilitySelectedVariant = {
  price: number

So how could i use that to get the total price after they have chosen the variants?

Got it.
I made the prices to the dataset and then referenced them in the code, and added on each selection. Works great.

If you have this same problem that you want to setup showing prices to the:

I can help you. Just tag me.

Thanks for all.