php - Get product id, name and quantity on WooCommerce Ajax added to cart to display a notice
Get the solution ↓↓↓
Browsed a load of similar questions with no success so far.
I want to display a WC notice naming the last item added to the cart on a regular page.
Notification is up and running, however, so far I was not able to identify the ID of last item added to the cart.
I've tried this
$items = WC()->cart->get_cart();
$ids = array();
foreach($items as $item => $values) {
$_product = $values['data']->post;
$ids[] = $_product->ID;
}
$last_product_id = end($ids);
$added_product = wc_get_product( $last_product_id );
$added_product_name = $added_product->get_title();
But as I've learned cart content does not get updated during AJAX calls. The easiest way to obtain the product ID should be the AJAX parameter containing it, but it cannot be read via $_GET.
Does anyone know of a way to retrieve the product ID of the last item added via WC hook/jQuery?
Answer
Solution:
For Ajaxadded_to_cart delegated event.
Using jQuery you can get easily the product ID, the product name, and the quantity of a product that has been added to cart with Ajax.
Here in this code example using Sweet Alert component (SWAL 2), when a product is added to cart, we display a message lightbox, with the product name (and its ID):
// Add the product name as data argument to Ajax add to cart buttons
add_filter( "woocommerce_loop_add_to_cart_args", "filter_wc_loop_add_to_cart_args", 20, 2 );
function filter_wc_loop_add_to_cart_args( $args, $product ) {
if ( $product->supports( 'ajax_add_to_cart' ) && $product->is_purchasable() && $product->is_in_stock() ) {
$args['attributes']['data-product_name'] = $product->get_name();
}
return $args;
}
// On Ajax added to cart, shows a lightbox with the product name (and the product id)
add_action( 'wp_footer', 'ajax_added_to_cart_popup_script' );
function ajax_added_to_cart_popup_script() {
?>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<script type="text/javascript">
jQuery( function($){
// On "added_to_cart" live event
$(document.body).on('added_to_cart', function( a, b, c, d ) {
var prod_id = d.data('product_id'), // Get the product name
prod_qty = d.data('quantity'), // Get the quantity
prod_name = d.data('product_name'); // Get the product name
Swal.fire({
title: '<?php _e("Added to cart!"); ?>',
text: prod_name+' ('+prod_id+')',
showCancelButton: true,
confirmButtonColor: '#000',
cancelButtonColor: '#3085d6',
confirmButtonText: '<?php _e("View-cart"); ?>',
cancelButtonText: '<?php _e("Continue shopping"); ?>'
}).then((result) => {
if (result.value) {
window.location.href = '<?php echo wc_get_cart_url(); ?>';
}
});
});
});
</script>
<?php
}
Code goes in function.php file of your active child theme (or active theme). Tested and works.
Related:
Share solution ↓
Additional Information:
Link To Answer People are also looking for solutions of the problem: mysqli::real_connect(): (hy000/2002): connection refused
Didn't find the answer?
Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.
Similar questions
Find the answer in similar questions on our website.
Write quick answer
Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.