Add to cart button added the same product issue

Question

I have created a custom phtml for my homepage. Here i check for all products in a specific category.

All the products and the information looks fine, but i have a problem with adding the product to cart. If a add the first product on the line everything works fine, but if a tried to add the second product, or third product and so on, magento added to cart to cart only the first product. So for example:

Clik on the second product "Add to cart button", first product addded instead of the second one and so on.

My form looks like this:

<form action="<?php echo $this->helper('checkout/cart')->getAddUrl($_product) ?>" method="post" id="product_addtocart_form"<?php if($_product->getOptions()): ?> enctype="multipart/form-data"<?php endif; ?>>
                    <?php $buttonTitle = $this->__('Add to Cart'); ?> 
                        <div class="add-to-cart">
                            <?php if(!$_product->isGrouped()): ?>
                            <label for="qty"><?php echo $this->__('Qty:') ?></label>
                            <input type="text" name="qty" id="qty" maxlength="12" placeholder="<?php echo $this->__('Amount'); ?>" value="<?php echo $this->getProductDefaultQty() * 1 ?>" title="<?php echo Mage::helper('core')->quoteEscape($this->__('Qty')) ?>" class="input-text qty" />
                            <?php endif; ?>
                            <button type="button" title="<?php echo $buttonTitle ?>" id="product-addtocart-button" class="button btn-cart" onclick="productAddToCartForm.submit(this)"><span><span><?php echo $buttonTitle ?></span></span></button> 
                            <?php echo $this->getChildHtml('', true, true) ?>
                        </div>
                    </form>

and my JS:

<script type="text/javascript">
    //<![CDATA[
        var productAddToCartForm = new VarienForm('product_addtocart_form');
        productAddToCartForm.submit = function(button, url) {
            alert("hiii");
            if (this.validator.validate()) {
                var form = this.form;
                var oldUrl = form.action;

                if (url) {
                   form.action = url;
                } 
                var e = null;
                try {
                    this.form.submit();
                } catch (e) {
                }
                this.form.action = oldUrl;
                if (e) {
                    throw e;
                }

                if (button && button != 'undefined') {
                    button.disabled = true;
                }
            }
        }.bind(productAddToCartForm);

        productAddToCartForm.submitLight = function(button, url){
            if(this.validator) {
                var nv = Validation.methods;
                delete Validation.methods['required-entry'];
                delete Validation.methods['validate-one-required'];
                delete Validation.methods['validate-one-required-by-name'];
                if (this.validator.validate()) {
                    if (url) {
                        this.form.action = url;
                    }
                    this.form.submit();
                }
                Object.extend(Validation.methods, nv);
            }
        }.bind(productAddToCartForm);
    //]]>
    </script>

I think the problem is here: <form action="<?php echo $this->helper('checkout/cart')->getAddUrl($_product) ?>".

For some reason on the action, $_product it's the same all the time.

Does anyone know why i have this problem?

Answer 1

I solved my add-to-cart's issue with this code:

<?php $formKey = Mage::getSingleton('core/session')->getFormKey();?>
                        <form action="/checkout/cart/add/product/<?php echo $_product->getId(); ?>" method="post" id="product_addtocart_form"<?php if($_product->getOptions()): ?> enctype="multipart/form-data"<?php endif; ?>>
                         <?php $buttonTitle = $this->__('Add to Cart'); ?>
                            <input type="hidden" name="form_key" value="<?php echo $formKey; ?>" />
                            <input type="text" name="qty" id="qty" maxlength="12" placeholder="<?php echo $this->__('Amount'); ?>" value="<?php echo $this->getProductDefaultQty() * 1 ?>" title="<?php echo Mage::helper('core')->quoteEscape($this->__('Qty')) ?>" class="input-text qty" />
                         <button type="submit" title="<?php echo $buttonTitle ?>" id="product-addtocart-button" class="button btn-cart"><span><span><?php echo $buttonTitle ?></span></span></button>  
                        </form> 

Answer 2

I believe you have no need to use form tag over here and Qty is also not needed. It's just needed on product details page.

You can update it with the following:

<button type="button" title="<?php echo Mage::helper('core')->quoteEscape($this->__('Add to Cart')) ?>" class="button btn-cart" onclick="setLocation('<?php echo $this->getAddToCartUrl($_product) ?>')"><span><span><?php echo $this->__('Add to Cart') ?></span></span></button>