Fragments to Update Cart Counter not working on homepage - Woocommerce

Question

I'm creating a website where the users can add a product to cart (using ajax) from homepage. I'm using a JS function to do this, and it's working. Also, I have a function that updates the custom cart counter from header.

If i'm on Shop or Cart page, the woocommerce fragments works perfectly, updating my custom cart counter. But when I'm on homepage, the cart counter just updates if I refresh any other page.

I tried to trigger the fragments event after the triggering of 'added_to_cart' event, as you can see below, but it did'nt worked.

Javascript Function that triggers the event 'added_to_cart' on homepage

$('.homepage_add_to_cart_button').on('click', function(e) { 
  e.preventDefault();
  $thisbutton = $(this);
  id = $(this).val();
  addToCart(id);
  return false;
});

function addToCart(p_id) {
  var data = {
    action: 'ql_woocommerce_ajax_add_to_cart',
    product_id: p_id,
  };
  $.ajax({
    type: 'post',
    url: '?add-to-cart='+p_id,
    data: data,
    beforeSend: function (response) {
      $thisbutton.removeClass('added').addClass('loading');
    },
    complete: function (response) {
      $thisbutton.addClass('added').removeClass('loading');
    }, 
    success: function (response) { 
      if (response.error & response.product_url) {
        window.location = response.product_url;
        return;
      } else { 
        $(document.body).trigger('added_to_cart', [response.fragments, response.cart_hash, $thisbutton]);
        $(document.body).trigger('wc_fragment_refresh');
      }
    },
  });
}

I'm using this code on functions.php of woocommerce fragments to update the custom cart counter that I have on header.

function holistic_refresh_cart_count($fragments) {
    ob_start();
    ?>
    <span class="header-cart-count">
        <?php echo WC()->cart->get_cart_contents_count(); ?>
    </span>
    <?php
    $fragments['.header-cart-count'] = ob_get_clean();
    return $fragments;
}
add_filter( 'woocommerce_add_to_cart_fragments', 'holistic_refresh_cart_count');

Answer 1

add_filter( 'woocommerce_add_to_cart_fragments', function($fragments) {
    ob_start();
    ?>
    <li class="my_cart"><a href="javascript:void(0)" id="sidebarCollapse" class="carticonmain"><svg xmlns="http://www.w3.org/2000/svg" style="display: none;">          
          <symbol id="shopping-cart" viewBox="0 0 700 700"><title>shopping-cart</title>
              <path d="m150.355469 322.332031c-30.046875 0-54.402344 24.355469-54.402344 54.402344 0 30.042969 24.355469 54.398437 54.402344 54.398437 30.042969 0 54.398437-24.355468 54.398437-54.398437-.03125-30.03125-24.367187-54.371094-54.398437-54.402344zm0 88.800781c-19 0-34.402344-15.402343-34.402344-34.398437 0-19 15.402344-34.402344 34.402344-34.402344 18.996093 0 34.398437 15.402344 34.398437 34.402344 0 18.996094-15.402344 34.398437-34.398437 34.398437zm0 0"></path>
                <path d="m446.855469 94.035156h-353.101563l-7.199218-40.300781c-4.4375-24.808594-23.882813-44.214844-48.699219-48.601563l-26.101563-4.597656c-5.441406-.96875-10.632812 2.660156-11.601562 8.097656-.964844 5.441407 2.660156 10.632813 8.101562 11.601563l26.199219 4.597656c16.53125 2.929688 29.472656 15.871094 32.402344 32.402344l35.398437 199.699219c4.179688 23.894531 24.941406 41.324218 49.199219 41.300781h210c22.0625.066406 41.546875-14.375 47.902344-35.5l47-155.800781c.871093-3.039063.320312-6.3125-1.5-8.898438-1.902344-2.503906-4.859375-3.980468-8-4zm-56.601563 162.796875c-3.773437 12.6875-15.464844 21.367188-28.699218 21.300781h-210c-14.566407.039063-27.035157-10.441406-29.5-24.800781l-24.699219-139.398437h336.097656zm0 0"></path>
                <path d="m360.355469 322.332031c-30.046875 0-54.402344 24.355469-54.402344 54.402344 0 30.042969 24.355469 54.398437 54.402344 54.398437 30.042969 0 54.398437-24.355468 54.398437-54.398437-.03125-30.03125-24.367187-54.371094-54.398437-54.402344zm0 88.800781c-19 0-34.402344-15.402343-34.402344-34.398437 0-19 15.402344-34.402344 34.402344-34.402344 18.996093 0 34.398437 15.402344 34.398437 34.402344 0 18.996094-15.402344 34.398437-34.398437 34.398437zm0 0"></path>
             </symbol> 
        </svg><svg class="icon" viewBox="0 0 40 40"><use xlink:href="#shopping-cart" x="12%" y="16%"></use></svg><i class="item_number">
        <?php echo WC()->cart->get_cart_contents_count(); ?>
    </i></a></li>

    <?php $fragments['li.my_cart'] = ob_get_clean();

    return $fragments;

} );

add_filter( 'woocommerce_add_to_cart_fragments', function($fragments) {
    ob_start();
    woocommerce_mini_cart(); ?>
    $fragments['div.minicart_all_data'] = ob_get_clean();
    return $fragments;

} );