Hi, I have a pricing table where each option has a select field that allows them to select their monthly credits. This needs to change the price. How can I achieve this? I assume its through interactions or custom states but I’m having trouble locating a resource that can walk me through it.
Heres a look at the table for reference:
You’d accomplish that with custom script. Are you only changing the price per month that appears above? If so it’s pretty simple.
- Give your combobox a custom attribute -
price-sel, set the value to
starter for the Starter one,
pro for the Pro plan, etc.
- For the value for each element, give the price you want to display. So e.g. if 40,000 Word Limit / month is $29, you’d set the value of that option to
- To the text element where you want that price to appear, add a custom attribute -
price-display,a nd set the value to
Now you’ve clearly identifier what changes what where.
Add this script to do the job, in your /body custom code area;
const priceType = $(this).attr("price-sel");
Note I’ve just written this out, untested. Let me know if I glitched anything.
Thanks! I really appreciate you taking the time to write that out for me. It works perfectly.
Hi. thats awesome! Thank you!
How can I also change the “buy” button link to redirect the customer to the right checkout page?
Price 1 → redirect to Link1
Price 2 → redirect to Link 2
I would like to have a price table where a customer can select the user-seats they want to have. Based on that the price updates and the button-link, so they get to the right stripe checkout page