In Shopify how to add multiple products to cart with varying quantities via url

Question

I know in Shopify you can add multiple products like this:

/cart/add?id[]=VARIANT_ID1&id[]=VARIANT_ID2

My question is how would you adjust the quantity of each product that's being added?

For example I wanted VARIANT_ID1 to have a quantity of 2 and VARIANT_ID2 to have a quantity of 1?

I tried this:

/cart/add?id[]=VARIANT_ID1&quantity=2&id[]=VARIANT_ID2&quantity=1

But it just made the quantity 1 for everything.

Answer 1

Update

There was an update to the AJAX API that allows now to add multiply variants with different quantities with the same request.

Example:

fetch('/cart/add.js', {
    method: "post",
    headers: { 'content-type': 'application/json' },
    body: JSON.stringify({
        items: [
            {
                id: 33116502556724,
                quantity: 5
            },
            {
                id: 33116502589492,
                quantity: 3
            }
        ]
    })
})

Old Answer

You can't use the quantity as a separate item for each variant.

You have a few options but they all have some cons.

Please refer to this doc for the requests: https://help.shopify.com/en/themes/development/getting-started/using-ajax-api

Using /cart/add.js

You can create multiply AJAX request and add each separate item as a new AJAX request.

Pros:

• it won't affect the products in the cart if they are already present

Cons:

• Too many AJAX requests

---

Using /cart/update.js

You can make a single request and pass different quantity to each variant.

Pros

• Save all variants with a single AJAX request with different quantity

Cons

• You will overwrite the quantity of the product if they are already added in the cart

---

So the solution may be to get the cart.js response check if the current variants are present and if they are then make an update.js while adding the quantity to the existing one. So it's not so straightforward.

I can't think of an easier solution but at the end you might need a minimum of 2 AJAX calls to add a different quantity.