How to make buttons change quantity?

[TheDuckDuck]

I had GPT make these buttons in a custom liquid and I need help figuring out how to make them set the quantity value when clicked. GPT already made some script but idk how it works. All I want is that when the "Single" button is clicked that the quantity is set to 1, for "Duck Buddies" the quantity is set to 2, and for "Duck Trio" the quantity is set to 3. 

My store URL is: https://dododuck.ca/products/dodo-duck

Thank you so much for any help

[tim · Accepted solution]

Probably not the best approach -- you could've created a 2-piece and 3-piece variants with proper pricing, or use Bundles app to create those bundles -- both will give you benefit of properly updating price.

But, to continue with what you've started you'd want to amend your code like this:

      // Here, you could update the quantity selector on your page

      let inp = document.querySelector('[name="quantity"]');
      if (inp) inp.value = quantity;

And then probably hide the quantity selector with CSS:

<style>
 .product-form__quantity {
   display: none;
 }
</style>

Do not remove the quantity input block from the section -- it's still used, even if hidden.

Finally, you should probably add some wording like "Bundle discount applied at checkout" or alike because the pricing displayed does not match your claim in bundle selector.

[TheDuckDuck]

I'm so dumb, idk why I didn't think that there was an app for it. Thank you so much!