WooCommerce programmatically deleting from cart

Question

How do I programmatically remove an item from the Woocommerce cart using AJAX? I tried putting a function in my functions.php file and accessing that but nothing gets deleted. I tried hard-coding product 299 but it doesn't delete. Here's what I did:

functions.php

function remove_item_from_cart() {
    $cart = WC()->instance()->cart;
    $id = 299;
    $cart_id = $cart->generate_cart_id($id);
    $cart_item_id = $cart->find_product_in_cart($cart_id);

    if($cart_item_id){
       $cart->set_quantity($cart_item_id, 0);
    }
    return true;
}

themes/mine/main.js

$.ajax({
    type: 'POST',
    dataType: 'text',
    url: "http://www.../wp/wp-content/themes/mine/functions.php",
    data: {
        action: 'remove_item_from_cart'
    },
    success: function( data ) {
        console.log(data);
    }
});

Answer 1

Use proper ajax method of wordpress like this: This worked fine for me.

//functions.php

    function remove_item_from_cart() {
    $cart = WC()->instance()->cart;
    $id = $_POST['product_id'];
    $cart_id = $cart->generate_cart_id($id);
    $cart_item_id = $cart->find_product_in_cart($cart_id);

    if($cart_item_id){
       $cart->set_quantity($cart_item_id, 0);
       return true;
    } 
    return false;
    }

    add_action('wp_ajax_remove_item_from_cart', 'remove_item_from_cart');
    add_action('wp_ajax_nopriv_remove_item_from_cart', 'remove_item_from_cart');

//main.js

    $.ajax({
        type: "POST",
        url: 'http://localhost/your_site/wp-admin/admin-ajax.php',
        data: {action : 'remove_item_from_cart','product_id' : '4'},
        success: function (res) {
            if (res) {
                alert('Removed Successfully');
            }
        }
    });

Answer 2

This seems to work.

HTML:

<?php
  foreach ( WC()->cart->get_cart() as $cart_item_key => $cart_item ){
    ?<
       <button class="remove-item" data-cart-item-key="<?=$cart_item_key;?>">
          remove item
       </button>
    <?
  }
?>

Javascript:

$('.remove-item').click(function(e){
    e.preventDefault();
    $.ajax({
        type: "POST",
        url: ajaxurl,
        data: {
                action: 'remove_item_from_cart', 
               'cart_item_key': String($(this).data('cart-item-key'))
               }
    });
});

In functions.php, inside the template folder:

function remove_item_from_cart() {
    $cart_item_key = $_POST['cart_item_key'];
    if($cart_item_key){
       WC()->cart->remove_cart_item($cart_item_key);
       return true;
    } 
    return false;
}
add_action('wp_ajax_remove_item_from_cart', 'remove_item_from_cart');
add_action('wp_ajax_nopriv_remove_item_from_cart', 'remove_item_from_cart');

Answer 3

For WooCommerce 3.0+ you can do it using the built-in remove_cart_item() function

function findCartItemKey($cartItems, $productId){               
  foreach($cartItems as $cartKey => $item){
    $product = $item['data'];
    if($product->get_id() == $productId){
            return $cartKey;
    }       
    return false;
  }    
}

global $woocommerce;
$cartItemKey = findCartItemKey($woocommerce->cart->get_cart())
$woocommerce->cart->remove_cart_item($cartItemKey);