I am trying to decrease cart item quantity when clicking on the cart item remove link if quantity is greater than one:
<code>function action_woocommerce_remove_cart_item( $cart_item_key, $instance ) {
// print_r($cart_item_key);
$item = WC()->cart->get_cart_item( $cart_item_key );
// print_r($item);
// echo $item['quantity'];
if($item['quantity'] > 1){
WC()->cart->set_quantity($cart_item_key, $item['quantity']-1);
echo do_shortcode( '<div class="woocommerce"><div class="woocommerce-notices-wrapper"></div><div class="wc-empty-cart-message">
<div class="cart-empty woocommerce-info">
Chưa có sản phẩm nào trong giỏ hàng. </div>
</div> <p class="return-to-shop">
<a class="button wc-backward" href="https://z.id.vn">
Quay trở lại cửa hàng </a>
</p>
</div>' );
exit();
}
};
// Add the action
add_action( 'woocommerce_remove_cart_item', 'action_woocommerce_remove_cart_item', 10, 2 );
</code>
<code>function action_woocommerce_remove_cart_item( $cart_item_key, $instance ) {
// print_r($cart_item_key);
$item = WC()->cart->get_cart_item( $cart_item_key );
// print_r($item);
// echo $item['quantity'];
if($item['quantity'] > 1){
WC()->cart->set_quantity($cart_item_key, $item['quantity']-1);
echo do_shortcode( '<div class="woocommerce"><div class="woocommerce-notices-wrapper"></div><div class="wc-empty-cart-message">
<div class="cart-empty woocommerce-info">
Chưa có sản phẩm nào trong giỏ hàng. </div>
</div> <p class="return-to-shop">
<a class="button wc-backward" href="https://z.id.vn">
Quay trở lại cửa hàng </a>
</p>
</div>' );
exit();
}
};
// Add the action
add_action( 'woocommerce_remove_cart_item', 'action_woocommerce_remove_cart_item', 10, 2 );
</code>
function action_woocommerce_remove_cart_item( $cart_item_key, $instance ) {
// print_r($cart_item_key);
$item = WC()->cart->get_cart_item( $cart_item_key );
// print_r($item);
// echo $item['quantity'];
if($item['quantity'] > 1){
WC()->cart->set_quantity($cart_item_key, $item['quantity']-1);
echo do_shortcode( '
Chưa có sản phẩm nào trong giỏ hàng.
' );
exit();
}
};
// Add the action
add_action( 'woocommerce_remove_cart_item', 'action_woocommerce_remove_cart_item', 10, 2 );
This way the cart item remove link hook is returning cart page HTML by using do_shortcode('
Chưa có sản phẩm nào trong giỏ hàng.
') so that the final deletion doesn’t happen.
But somehow the shorcode is also returning the link with:
<code><input type="hidden" name="_wp_http_referer" value="/courses/cart/?remove_item=2365a4db507862569752334234a29b50&_wpnonce=fd962ed />`
</code>
<code><input type="hidden" name="_wp_http_referer" value="/courses/cart/?remove_item=2365a4db507862569752334234a29b50&_wpnonce=fd962ed />`
</code>
<input type="hidden" name="_wp_http_referer" value="/courses/cart/?remove_item=2365a4db507862569752334234a29b50&_wpnonce=fd962ed />`
so if I try changing cart item quantity afterward on the cart page and click on update cart, It’s trying to delete again, setting the quantity in the same way.
0
You need a complete different approach, changing cart item remove link based on quantity, and using some JavaScript (jQuery) code:
<code>// Change cart item remove link based on quantity
add_filter( 'woocommerce_cart_item_remove_link', 'change_cart_item_remove_link_based_on_qty', 10, 2 );
function change_cart_item_remove_link_based_on_qty( $remove_link, $cart_item_key ) {
$cart_item = WC()->cart->cart_contents[ $cart_item_key ];
$_product = apply_filters( 'woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key );
$product_id = apply_filters( 'woocommerce_cart_item_product_id', $cart_item['product_id'], $cart_item, $cart_item_key );
$product_name = apply_filters( 'woocommerce_cart_item_name', $_product->get_name(), $cart_item, $cart_item_key );
if ( $cart_item['quantity']> 1 ) {
$remove_link = sprintf(
'<span class="decrease_qty" aria-label="%s" data-product_id="%s" data-product_sku="%s">×</span>',
/* translators: %s is the product name */
esc_attr( sprintf( __( 'Decrease quantity for %s from cart', 'woocommerce' ), wp_strip_all_tags( $product_name ) ) ),
esc_attr( $product_id ),
esc_attr( $_product->get_sku() )
);
}
return $remove_link;
}
// Add Inline CSS and Javascript to cart page
add_action( 'woocommerce_before_cart_contents', 'add_cart_inline_css_and_js', 10, 2 );
function add_cart_inline_css_and_js() {
// CSS
?><style>
span.decrease_qty {
display: block;
width: 1.618em;
height: 1.618em;
line-height: 1.618;
font-weight: 400;
text-indent: -9999px;
overflow: hidden;
position: relative;
}
span.decrease_qty::before {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
display: inline-block;
cursor:pointer;
font-style: normal;
font-variant: normal;
font-weight: 400;
line-height: 1;
font-family: "Font Awesome 5 Free";
font-weight: 900;
line-height: inherit;
vertical-align: baseline;
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
color: #737781;
line-height: 1.618;
text-indent: 0;
text-align: center;
}
table.cart td.product-remove span.decrease_qty {
position: absolute;
font-size: 1.41575em;
top: -.6180469716em;
right: -.6180469716em;
}
@media (min-width: 768px) {
table.cart td.product-remove span.decrease_qty {
float: none;
position: relative;
top: auto;
right: auto;
font-size: 1em;
}
}
</style><?php
// Javascript: Decrease the cart item quantity and update cart
wc_enqueue_js("$(document.body).on('click', 'span.decrease_qty', function(e) {
e.preventDefault();
const qtyInput = $(this).closest('tr').find('input.qty');
qtyInput.attr('value', qtyInput.val()-1);
$('button[name="update_cart"]').removeAttr('disabled').trigger('click');
});");
}
</code>
<code>// Change cart item remove link based on quantity
add_filter( 'woocommerce_cart_item_remove_link', 'change_cart_item_remove_link_based_on_qty', 10, 2 );
function change_cart_item_remove_link_based_on_qty( $remove_link, $cart_item_key ) {
$cart_item = WC()->cart->cart_contents[ $cart_item_key ];
$_product = apply_filters( 'woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key );
$product_id = apply_filters( 'woocommerce_cart_item_product_id', $cart_item['product_id'], $cart_item, $cart_item_key );
$product_name = apply_filters( 'woocommerce_cart_item_name', $_product->get_name(), $cart_item, $cart_item_key );
if ( $cart_item['quantity']> 1 ) {
$remove_link = sprintf(
'<span class="decrease_qty" aria-label="%s" data-product_id="%s" data-product_sku="%s">×</span>',
/* translators: %s is the product name */
esc_attr( sprintf( __( 'Decrease quantity for %s from cart', 'woocommerce' ), wp_strip_all_tags( $product_name ) ) ),
esc_attr( $product_id ),
esc_attr( $_product->get_sku() )
);
}
return $remove_link;
}
// Add Inline CSS and Javascript to cart page
add_action( 'woocommerce_before_cart_contents', 'add_cart_inline_css_and_js', 10, 2 );
function add_cart_inline_css_and_js() {
// CSS
?><style>
span.decrease_qty {
display: block;
width: 1.618em;
height: 1.618em;
line-height: 1.618;
font-weight: 400;
text-indent: -9999px;
overflow: hidden;
position: relative;
}
span.decrease_qty::before {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
display: inline-block;
cursor:pointer;
font-style: normal;
font-variant: normal;
font-weight: 400;
line-height: 1;
font-family: "Font Awesome 5 Free";
font-weight: 900;
line-height: inherit;
vertical-align: baseline;
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
color: #737781;
line-height: 1.618;
text-indent: 0;
text-align: center;
}
table.cart td.product-remove span.decrease_qty {
position: absolute;
font-size: 1.41575em;
top: -.6180469716em;
right: -.6180469716em;
}
@media (min-width: 768px) {
table.cart td.product-remove span.decrease_qty {
float: none;
position: relative;
top: auto;
right: auto;
font-size: 1em;
}
}
</style><?php
// Javascript: Decrease the cart item quantity and update cart
wc_enqueue_js("$(document.body).on('click', 'span.decrease_qty', function(e) {
e.preventDefault();
const qtyInput = $(this).closest('tr').find('input.qty');
qtyInput.attr('value', qtyInput.val()-1);
$('button[name="update_cart"]').removeAttr('disabled').trigger('click');
});");
}
</code>
// Change cart item remove link based on quantity
add_filter( 'woocommerce_cart_item_remove_link', 'change_cart_item_remove_link_based_on_qty', 10, 2 );
function change_cart_item_remove_link_based_on_qty( $remove_link, $cart_item_key ) {
$cart_item = WC()->cart->cart_contents[ $cart_item_key ];
$_product = apply_filters( 'woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key );
$product_id = apply_filters( 'woocommerce_cart_item_product_id', $cart_item['product_id'], $cart_item, $cart_item_key );
$product_name = apply_filters( 'woocommerce_cart_item_name', $_product->get_name(), $cart_item, $cart_item_key );
if ( $cart_item['quantity']> 1 ) {
$remove_link = sprintf(
'<span class="decrease_qty" aria-label="%s" data-product_id="%s" data-product_sku="%s">×</span>',
/* translators: %s is the product name */
esc_attr( sprintf( __( 'Decrease quantity for %s from cart', 'woocommerce' ), wp_strip_all_tags( $product_name ) ) ),
esc_attr( $product_id ),
esc_attr( $_product->get_sku() )
);
}
return $remove_link;
}
// Add Inline CSS and Javascript to cart page
add_action( 'woocommerce_before_cart_contents', 'add_cart_inline_css_and_js', 10, 2 );
function add_cart_inline_css_and_js() {
// CSS
?><style>
span.decrease_qty {
display: block;
width: 1.618em;
height: 1.618em;
line-height: 1.618;
font-weight: 400;
text-indent: -9999px;
overflow: hidden;
position: relative;
}
span.decrease_qty::before {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
display: inline-block;
cursor:pointer;
font-style: normal;
font-variant: normal;
font-weight: 400;
line-height: 1;
font-family: "Font Awesome 5 Free";
font-weight: 900;
line-height: inherit;
vertical-align: baseline;
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
color: #737781;
line-height: 1.618;
text-indent: 0;
text-align: center;
}
table.cart td.product-remove span.decrease_qty {
position: absolute;
font-size: 1.41575em;
top: -.6180469716em;
right: -.6180469716em;
}
@media (min-width: 768px) {
table.cart td.product-remove span.decrease_qty {
float: none;
position: relative;
top: auto;
right: auto;
font-size: 1em;
}
}
</style><?php
// Javascript: Decrease the cart item quantity and update cart
wc_enqueue_js("$(document.body).on('click', 'span.decrease_qty', function(e) {
e.preventDefault();
const qtyInput = $(this).closest('tr').find('input.qty');
qtyInput.attr('value', qtyInput.val()-1);
$('button[name="update_cart"]').removeAttr('disabled').trigger('click');
});");
}
Code goes in functions.php file of your child theme (or in a plugin). Tested on WooCommerce Storefront theme and work.
You may need to adjust The CSS to match with your web design. This