Quantity field not working in WooCommerce

Question

I have this website: http://artware.gr/decouni/home/

At the top right corner you can see a cart icon. If you hover it, you will see the 'add to cart' button, as well as the quantity form.

To check if it's working, add 3 items and press the button to add them.

If you do it, the button and quantity form will be gone and the 'checkout' button will appear.

But we need to confirm that the cart has 3 items in total.

To see the cart, simply click on the cart icon.

Unfortunately, the quantity will be 1 instead of 3.

---

What have I tried so far:

I came up with 2 ways of fixing this, but both ways have their problems.

1 WAY I created a fixed area where the button pops up. It is just the WooCommerce mini cart widget.

wp-content/themes/stockholm/woocommerce/cart/mini-cart.php

Inside it, I just called this:

<?php echo do_shortcode('[add_to_cart id="246"]'); ?>

The 246 is the id of the product since the whole form is appeared on a simple page and not inside a product page, I had to call the add to cart button manually.

So, after the form is appeared, I edit the:

wp-content/themes/stockholm/woocommerce/loop/add-to-cart.php

so that I can include the quantity form to the area. By default, WC is not including the quantity form when you call the add to cart button.

You can see the whole code of add-to-cart.php here: http://pastebin.com/f7mNF6Cq

1 WAY's PROBLEM

This way is what I have live now. As I said the form is appearing correctly, but not working as intended.

2 WAY

I found another piece of code to insert inside the add-to-cart.php:

http://pastebin.com/agxL8ica

2 WAY's PROBLEM

When I add this code to the add-to-cart.php, although it appears correctly, when I insert 3 items in quantity and press the Add to cart button, a white page appears with some code on it.

http://pastebin.com/BCqRHie9

Also the URL changes to:

http://artware.gr/decouni/home/?wc-ajax=get_refreshed_fragments&add-to-cart=246

Now the tricky part!

If I reopen the homepage and click on the cart icon in order to view the Cart, I can see that the quantity is 3 ! So the code above, even though it shows a white page, it's working in the matter of quantity.

---

WAY 1 it shows no error when I click the add to cart button :) WAY 1 will not pass the quantity value to the cart :(

WAY 2 it shows error when I click the add to cart button :( WAY 2 will pass the quantity value to the cart :)

--- Currently on the live site, you can see the WAY 1 being applied.

I think that the code of the WAY 2 might be an old version of WC, that's why it's not working correctly.

Answer 1

<?php 

global $product; 


if (!in_array($product->product_type, array('variable', 'grouped', 'external'))) {
    // only if can be purchased
    if ($product->is_purchasable()) {
        // show qty +/- with button
        ob_start();
        woocommerce_simple_add_to_cart();
        $button = ob_get_clean();

        // modify button so that AJAX add-to-cart script finds it
        $replacement = sprintf('data-product_id="%d" data-quantity="1" $1 add_to_cart_button product_type_simple ', $product->id);
        $button = preg_replace('/(class="single_add_to_cart_button)/', $replacement, $button);
    }
}
// output the button
    echo $button;
?>

<script>
jQuery(function($) {

<?php /* when product quantity changes, update quantity attribute on add-to-cart button */ ?>
$("form.cart").on("change", "input.qty", function() {
    $(this.form).find("button[data-quantity]").attr("data-quantity", this.value);
});

<?php /* remove old "view cart" text, only need latest one thanks! */ ?>
$(document.body).on("adding_to_cart", function() {
    $("a.added_to_cart").remove();
});

});
</script>