Remove item I just added

[Harrison]

Is there a way I can create a button that removes a product that i just added to the cart?

[azicchetti]

Hi,
untested but it should point you in the right direction:

let cartItems = Snipcart.store.getState().cart.items.items;
if (cartItems.length > 0) {
    let lastItem = cartItems.slice(-1)[0];
    Snipcart.api.cart.items.remove(lastItem.uniqueId);
}

Cheers,
Andrea

[dominic]

Hi there,

@azicchetti ’ solution is using the right API method for your need. You basically need the unique ID of the item you want to remove and pass it to the remove method. You can find more information about this method in our documentation : JavaScript SDK API – Snipcart Documentation

Hope this helps!

[Harrison]

Hi that’s not quite what i meant.

I’m looking to have the function that once a product is added, a ‘remove’ button then appears. So if you click the ‘remove’ button, it will remove that specific product, not just the most recently added

[Harrison]

@dominic @azicchetti Any ideas on my last comment?

[Harrison]

Currently got this, but doesn’t work. I have multiple products on 1 page so struggling to get each of their unique Id’s

methods: {
    remove: function () {
      Snipcart.api.cart.items.remove("this.uniqueId");
    },
  },

[Guillaume]

Hi there,

You might have luck with something like this:

Snipcart.events.on('item.added', (cartItem) => {
    let uniqueId = cartItem.uniqueId;
    let itemId = cartItem.id;
    let addToCartButton = FindItemButtonInHtmlPageWithItemId(itemId)

   let deleteBtn = document.createElement("button");
   btn.innerHTML = "Delete the product";
   btn.onclick = function () {
      Snipcart.api.cart.item.remove(uniqueId)
   };
   addToCartButton.parent.appendChild(deleteBtn);
});