For a client project we’re currently working on, I get to dive into WooCommerce for the first time. The client was already using JigoShop—WooCommerce was forked from that project—so WooCommerce was a logical upgrade.
One thing that frustrated me was how WooCommerce used a number input field for setting the quantity a customer wanted to purchase. A select field felt more natural, perhaps because that’s what Amazon (and other eCommerce behemoths) use. Using a select field for quantity inputs improves the user experience, and looks better too!
There are a number of code snippets that purport to replace WooCommerce’s quantity inputs with a quantity select field floating around the web, but they all had problems. Some only worked on the product page but not the cart. Others worked in both places, but didn’t properly update the quantity in certain places, or didn’t accurately reflect the current quantity.
Using the code from this version by Github user “kloon” as a starting point, I fixed it up so it worked exactly as desired: it correctly updates the quantity, and reflects the current quantity in the cart. Check out the snippet after the jump!
