How to add multiple products to a shopping cart simultaneously in Shopify？

Retired Boards Appdev Store Design
1

There is currently a new requirement to select multiple product modules, allowing users to freely choose products. When they click on the unique add purchase button, they will add these selected products to the shopping cart. I don’t know how to achieve this goal. If someone could provide help, I would greatly appreciate it!
As shown in the following figure

more_product.jpg
more_product.jpg417×768 33.3 KB

2

Hi @JonasLi

To implement the same plz use the below script in main-product.liquid

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

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);
});

for more details regarding cart ajax plz refer below URL

https://shopify.dev/docs/api/ajax/reference/cart

Hope this will help…

2 Likes
3

Is there an easy way, to then reload and show the cart drawer on the side?

Liken an update cart drawer function I could call?

Because right now all Items are added but the customer is not able to see them, only after a page reload

4

@Jannik_Soul every theme has its own structure therefore opening cart event could be vary, however the easiest way to show the number is to reload the page after adding the items in cart.

Hope this will help…