Quantity Selector (plus & minus) Will Not Change Quantity - Palo Alto

Store Design
,

Topic summary

Quantity +/- on a Shopify Palo Alto theme product page stopped changing the quantity. The public product link showed a dropdown (working), so a preview theme link was requested to see the actual +/- issue.

After the preview was shared, a JavaScript fix was provided: add code in theme.js to bind the .quantity__btn–decrease and .quantity__btn–increase buttons to update the .quantity__input value (respecting the input’s min). This corrected the non-responsive controls.

The original reporter confirmed the fix resolved their issue.

A new participant asked if the same approach applies to Shopify’s Dawn theme. Their product page quantity resets to 1 after clicking up/down due to an auto-refresh, while the cart quantity works. They also cannot locate a theme.js file and noted use of login/wholesale apps. No resolution was provided for Dawn; the question remains open.

Summarized with AI on December 26. AI used: gpt-5.
4

Hi @vavagraphics
Add the below code to the theme.js file. This will resolve the issue with quantity selector.

const decreaseButton = document.querySelector('.quantity__btn--decrease');const increaseButton = document.querySelector('.quantity__btn--increase');const quantityInput = document.querySelector('.quantity__input');function decreaseQuantity() {let currentValue = parseInt(quantityInput.value, 10);const minValue = parseInt(quantityInput.min, 10);if (currentValue > minValue) {currentValue--;quantityInput.value = currentValue;}}function increaseQuantity() {let currentValue = parseInt(quantityInput.value, 10);currentValue++;quantityInput.value = currentValue; }decreaseButton.addEventListener('click', decreaseQuantity);increaseButton.addEventListener('click', increaseQuantity);
1 Like