Ajax update product count on cart menu in Woocommerce - php

Question

I have a menu item that points to the cart and that reads the number of products currently in the cart.
CART (3)
When, on the cart page, I change the number of products and click the "Update cart" button, or delete an item, the number doesn't refresh.
Any idea why?
/*CHANGE CART MENU TITLE IN MENU*/
add_filter( 'wp_setup_nav_menu_item','my_item_setup' );
function my_item_setup($item) {
if ( ! is_admin() ) {
if ( class_exists( 'woocommerce' ) ) {
global $woocommerce;
if ( $item->url == esc_url( wc_get_cart_url() ) ) {
if (is_null($woocommerce->cart)){
} else {
if( get_locale() == 'fr_FR' ) {
$item->title = 'PANIER ('. '<span class="count-cart">' . $woocommerce->cart->get_cart_contents_count() . '</span>)';
} else {
$item->title = 'MY CART ('. '<span class="count-cart">' . $woocommerce->cart->get_cart_contents_count() . '</span>)';
}
}
}
}
}
return $item;
}
And
add_filter( 'woocommerce_add_to_cart_fragments', 'my_woocommerce_add_to_cart_fragments' );
function my_woocommerce_add_to_cart_fragments( $fragments ) {
// Add our fragment
$fragments['li.menu-item-type-woocommerce-cart'] = my_item_setup( '');
return $fragments;
}
EDIT:
Using Ajaxify the cart items count in Woocommerce answer code, seems to work a little better. The product number updates when I delete an item from the cart page, or when I change the number of items, but it doesn't update when I empty the cart. Moreover, there's a space before and after the product number (see picture with empty cart and "CART ( 1 )".
add_filter( 'woocommerce_add_to_cart_fragments', 'wc_refresh_cart_fragments');
function wc_refresh_cart_fragments($fragments){
ob_start();
?>
<span class="count-cart"><?php echo WC()->cart->get_cart_contents_count(); ?></span>
<?php
$fragments['li a span.count-cart'] = ob_get_clean();
return $fragments;
}

Answer 1

Updated
It's better to set a tag ID than a tag CLASS to ajaxify a cart count, as this selector reference need to be unique. If it's not the case, and there is a hidden mobile duplicated menu, it can't work.
So this item menu need to be unique on the generated html code of your page… If this menu item is duplicated in a mobile version, you will need to change the tag ID or the tag CLASS for the mobile code version.
I have revisited your code a bit:
add_filter( 'wp_setup_nav_menu_item','my_item_setup' );
function my_item_setup( $item ) {
if ( ! is_admin() && class_exists( 'woocommerce' ) ) {
if ( $item->url == esc_url( wc_get_cart_url() ) && ! WC()->cart->is_empty() ){
$title = get_locale() == 'fr_FR' ? 'PANIER' : 'MY CART';
$item->title = $title . ' (<span id="count-cart-items">' . WC()->cart->get_cart_contents_count() . '</span>)';
}
}
return $item;
}
add_filter( 'woocommerce_add_to_cart_fragments', 'wc_refresh_cart_fragments', 50, 1 );
function wc_refresh_cart_fragments( $fragments ){
$cart_count = WC()->cart->get_cart_contents_count();
// Normal version
$count_normal = '<span id="count-cart-items">' . $cart_count . '</span>';
$fragments['#count-cart-items'] = $count_normal;
// Mobile version
$count_mobile = '<span id="count-cart-itemob">' . $cart_count . '</span>';
$fragments['#count-cart-itemob'] = $count_mobile;
return $fragments;
}
Code goes in function.php file of your active child theme (active theme). It should better work.

Answer 2

To Ajaxify your cart viewer so it updates when an item is added or deleted (via ajax) use:
/**
* Show cart contents / total Ajax
*/
add_filter( 'woocommerce_add_to_cart_fragments', 'woocommerce_header_add_to_cart_fragment' );
function woocommerce_header_add_to_cart_fragment( $fragments ) {
global $woocommerce;
ob_start();
?>
<a class="cart-customlocation" href="<?php echo esc_url(wc_get_cart_url()); ?>" title="<?php _e('View your shopping cart', 'woothemes'); ?>"><?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'), $woocommerce->cart->cart_contents_count);?> - <?php echo $woocommerce->cart->get_cart_total(); ?></a>
<?php
$fragments['a.cart-customlocation'] = ob_get_clean();
return $fragments;
} ?>
Reference Link