获取 WooCommerce Ajax 上的产品 ID、名称和数量添加到购物车以显示通知

Posted 2023-05-08

【中文标题】获取 WooCommerce Ajax 上的产品 ID、名称和数量添加到购物车以显示通知

【英文标题】：Get product id, name and quantity on WooCommerce Ajax added to cart to display a notice

【发布时间】：2020-10-03 21:33:07

【问题描述】：

浏览了大量类似的问题，但到目前为止没有成功。

我想在常规页面上显示一个 WC 通知，命名添加到购物车的最后一项。

通知已启动并正在运行，但到目前为止，我无法识别最后添加到购物车的商品的 ID。

我试过了

    $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();

但据我所知，购物车内容不会在 AJAX 调用期间得到更新。获取产品 ID 最简单的方法应该是包含它的 AJAX 参数，但无法通过 $_GET 读取。

有谁知道通过 WC hook/jQuery 检索最后添加的商品的产品 ID 的方法吗？

【问题讨论】：

@LoicTheAztec：非常感谢您的广泛建议！只是注意到你取消了你的编辑，虽然......不过，我还是为你的善意努力捐款。我仍然需要弄清楚如何将 $product_id 变成我的通知。

我已经改变了我的答案，更专注于你想要做的事情。

【参考方案1】：

对于 Ajax added_to_cart 委托事件。

使用 jQuery，您可以轻松获取 产品 ID、产品名称，以及已通过 Ajax 添加到购物车的产品数量。

在此代码示例中使用 Sweet Alert 组件(SWAL 2)，当将产品添加到购物车时，我们会显示一个消息灯箱，其中包含产品名称（及其 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/sweetalert2@9"></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

代码进入您的活动子主题（或活动主题）的 function.php 文件中。经过测试并且可以工作。

相关：

Display a sweet alert on ajax add to cart for a specific Woocommerce cart item count Woocommerce: custom jquery event after added to cart

【讨论】：

漂亮！ 通过 woocommerce_loop_add_to_cart_args（我以前从未听说过的钩子）传递参数是一个非常好的解决方案。 谢谢老兄！

@LoicTheAztec，我直接尝试了这段代码，弹出窗口完美无缺，但是我看到未定义值的任何原因？很想听听您的意见。

@LoicTheAztec，这适用于商店或存档页面，但如何使其适用于单个产品页面？

@ccmanz 这不适用于单个产品页面，因为它仅适用于 Ajax 添加到购物车。同样在添加到购物车的单个产品上，页面会重新加载，因此不需要。