Updating the cart with a different variant after a variant is in the cart

Question

This would seem straightfoward but I can't figure it out. The situation:

• I have a product with two colour variants (yellow, orange).
• On the product page, the customer adds the default variant (yellow) to the cart.
• On the cart page, the customer should have the option of changing the colour. But if I select a new colour from the drop-down and update the cart, a new item is placed in the cart rather than the existing item being replaced.

I could have them select the colour before they add it to the cart but that seems a little messy since I'd be bringing part of the transaction onto the product page. And they would not be able to update the colour if they changed their mind.

I suspect that I need to use an event to somehow delete the existing item and replace it with the new one. But I have no idea how to accomplish that.

Answer 1

Probably easiest to show all the other variants available on the cart page next to the line item, then use ajax to remove the current line item, and add the new variant (with same line item options like qty, notes and options).

Hope that makes sense.