Routes is not defined - Dawn Template

[hnt88]

Clicking the Add button cause this issue:

Uncaught ReferenceError: routes is not defined
at ProductForm.onSubmitHandler (product-form.js?v=106714731521289003461653532105:33:16)

Current code that it takes me to shows the error lies in the following:

fetch(`${routes.cart_add_url}`, config)
.then((response) => response.json())
.then((response) => {
if (response.status) {
this.handleErrorMessage(response.description);

I haven't changed any of the coding at all so I'm not sure what has happened.

[made4Uo]

Hi @hnt88,

Follow the example code provided by shopify. You need to add the variantID (or productID if no variant), and the quantity. Refer to documentation here. 

let formData = {
 'items': [{
  'id': 36110175633573,
  'quantity': 2
  }]
};

fetch(window.Shopify.routes.root + 'cart/add.js', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(formData)
})
.then(response => {
  return response.json();
})
.catch((error) => {
  console.error('Error:', error);
});

[made4Uo]

Oh by bad. I thought you are writing a fetch function. You might have miss some comma or semi-colon. If you did not change much on the product-form.js. I recommend, to add a new Dawn theme. Copy the product-form.js contents and replace the product-form.js contents in your old theme.

[hnt88]

@made4Uo All good. I've just tried to do a exact copy of the product-form new Dawn theme and replaced it on my old theme and nothing had changed. So I'm not sure what else could've happened.

[made4Uo · Accepted solution]

Not sure if making a difference but can you try this code instead of the routes.cart_add_url

fetch(window.Shopify.routes.root + 'cart/add.js', config)

[hnt88]

@made4Uo you absolute legend! Seems like the template had incorrect coding from the start. Your solution fixed it!

[made4Uo]

Glad to know

[made4Uo]

Actually, this routes were set in the theme.liquid. 

[S90]

Perfect solution! Worked like a charm. 😎

NB: I'm using Sense theme.