Dynamically set price using Typeform React embed

Question

Sense the price variable is already created by typeform, is there any way to send a number to that variable via an option similar to how you can set hidden values?

I have tried:

<PopupButton
    id="12335"
    className={styles.card}
    hidden={{
        price: myPrice
    }}
>

and:

<PopupButton
    id="12335"
    className={styles.card}
    variables={{
        price: myPrice
    }}
>

but neither set the price variable in typeform. Any help would be appreciated.

Answer 1

Unfortunately it is not possible to specify price for typeform payment via hidden field. Since hidden fields are passed via URL anyone would be able to modify your price and pay any amount they choose.

Variables and hidden fields are 2 different features. (Also, in your second code example you are using invalid variables prop. This prop is not supported by our lib.)

If you want to want to collect payments for multiple products using single typeform, you would need to calculate the price using Typeform Logic right in your typeform. This article about order and payment form might help you.