Maison > Article > développement back-end > Comment mettre à jour dynamiquement le nombre d’articles du panier d’en-tête WooCommerce à l’aide d’Ajax ?
Aperçu :
Dans Woocommerce, mise à jour du nombre d'articles du panier d'en-tête lors de l'ajout /La suppression d'éléments peut être réalisée sans rechargement de page à l'aide d'Ajax.
Solution :
1. Balisage HTML pour le nombre de paniers :
Dans le header.php de votre thème, ajoutez le code suivant pour intégrer le nombre de paniers dans une balise HTML avec un identifiant ou une classe unique :
<code class="html"><?php $items_count = WC()->cart->get_cart_contents_count(); ?> <div id="mini-cart-count"><?php echo $items_count ? $items_count : ' '; ?></div></code>
2. Implémentation du code :
Ensuite, ajoutez ce code à votre fichier function.php ou à n'importe quel fichier de plugin :
<code class="php">add_filter( 'woocommerce_add_to_cart_fragments', 'wc_refresh_mini_cart_count'); function wc_refresh_mini_cart_count($fragments){ ob_start(); $items_count = WC()->cart->get_cart_contents_count(); ?> <div id="mini-cart-count"><?php echo $items_count ? $items_count : ' '; ?></div> <?php $fragments['#mini-cart-count'] = ob_get_clean(); return $fragments; }</code>
Ce hook met à jour l'élément "mini-cart-count" avec le nombre mis à jour après avoir ajouté des articles au panier.
3. Déclencheur jQuery facultatif :
Si vous souhaitez forcer la mise à jour du décompte via jQuery, utilisez l'un de ces événements délégués :
<code class="javascript">$(document.body).trigger('wc_fragment_refresh');</code>
<code class="javascript">$(document.body).trigger('wc_fragments_refreshed');</code>
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!