0

I am stuck here when i click on add to cart button the firefox console is giving the following error. ReferenceError: productAddToCartForm is not defined i have tried adding the $.noConflict() and jQuery.noConflict() but they are not helping.

This was working some time ago but now this throwing error although i havn't touch it for a while.

Any idea about it.

3
  • 2
    Whilst everyone here is eager to help - you have posted a lot of questions - all very much localised to you. This site is not here to answer questions about every issue you run into with your Magento store. Its a place where you can post general questions - where the answers will also be of benefit to other people. You should also make an effort to outline exactly what you have tried. Your question above is so vague and specific to yourself - how can anyone possibly answer the question? I have a JS error - why is it happening ... ? May 12, 2013 at 16:28
  • Go through a debug process first before posting - this methodology WILL identify 99% of issues with a Magento store and give you much more traceability. Then, if it still doesn't resolve your issue - outline exactly what you have done and the outcome of each (even then, its still probably localised, but a lot easier to answer). Don't be discouraged, just make a bit more effort and post better questions May 12, 2013 at 16:31
  • @sonassi Thanks a lot for your kind comments. I only post a question after making reasonable effort to the problem, BTW you have very good knowledge of this platform and i learn a lot from you. Thanks
    – Ravi Soni
    May 12, 2013 at 17:03

2 Answers 2

5

In Magento - there is a block of inline JS that is outputted on each product page for the productAddToCartForm

For example, on a Magento demo store

If you view a product and view the source of the page; search inline for var productAddToCartForm

You'll see a block of JS that declares the add to cart object and methods.

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

View the source on your own page and you'll either see this block missing - or present, but broken because of another JS conflict/error.

The respective JS can be found in

app/design/frontend/base/default/template/catalog/product/view.phtml 
3
  • I have checked that every thing is there. The url is premierpoolproducts.com/…
    – Ravi Soni
    May 12, 2013 at 16:58
  • 2
    Look at your page source. You are clearly trying to minify the HTML - and you've caused a JS error in the process. Remove your HTML minification - then remove the "TrustLogo()" call. May 12, 2013 at 17:01
  • Thanks a lot it htmlminify extension which was behind the scene but it was working fine a time ago don't know how it stopped working..
    – Ravi Soni
    May 12, 2013 at 17:23
1

Probably you are missing something in the product details page. In the default theme there is this javascript code that adds the product to cart or to wishlist.

var productAddToCartForm = new VarienForm('product_addtocart_form');
        productAddToCartForm.submit = function(button, url) {
            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'];
                // Remove custom datetime validators
                for (var methodName in Validation.methods) {
                    if (methodName.match(/^validate-datetime-.*/i)) {
                        delete Validation.methods[methodName];
                    }
                }

                if (this.validator.validate()) {
                    if (url) {
                        this.form.action = url;
                    }
                    this.form.submit();
                }
                Object.extend(Validation.methods, nv);
            }
        }.bind(productAddToCartForm);

Make sure this code exists in your page also and the form in the product page is properly closed and named product_addtocart_form.
Try to make the product page as much as possible similar to the default theme product page, at least from the structural point of view (demo can be seen here )

Not the answer you're looking for? Browse other questions tagged or ask your own question.