Exp-resso Store : Removing a Product/Item from Cart using products tag

Question

I have a situation where I have a page of products and when you add a product to cart, it simply redirects you back to the page and using the {if qty_in_cart} conditional, we're telling the user that the item is in the cart.

However, the client has now asked if there's a way to toggle the item in the cart all on this page. So the user adds the product to the cart and then it will give them the option to 'remove from cart'.

Here's what I have at the moment:

{exp:store:product entry_id="{entry_id}" disable_javascript="yes"}
<input type="hidden" name="item_qty" value="1" />
{title}
{if qty_in_cart}
<button class="btn btn-danger btn-small" name="remove_items[{key}]" value="1">
<i class="icon-shopping-cart"></i> Remove from Cart
</button>
{if:else}
<button class="btn btn-primary btn-small">
<i class="icon-shopping-cart"></i> Add to Cart
</button>
{/if}
{/exp:store:product}

However, this is resulting in 'disallowed characters' error message when its posted.

Is there a way that I can remove a product using the product tag?

Answer 1

I'm not sure if there's an officially supported way to do this, however I just ran a little experiment on a Store set I'm working on right now.

If you set the quantity to -1 and add the item to the cart again, it'll reduce the quantity in the cart.

So you could use some JavaScript to modify the value of your quantity hidden field and submit the same form and it should work.

Answer 2

As well as posting an item_qty of -1 (as Jeremy mentioned), you are also able to override the quantity of an item in the cart.

Instead of submitting an item_qty field, use update_qty. So you could use a hidden field to explicitly set the quantity of a particular item to 0:

<input type="hidden" name="update_qty" value="0" />