WooCommerce结账页AJAX更新购物车商品ID及自定义元数据方案

Got it, let's work through this problem step by step. You're trying to update cart items (including swapping product IDs and syncing custom metadata) via AJAX on the WooCommerce checkout order review table before payment, and you're stuck on implementing the core logic in the update_order_review flow. Here's a practical, tested solution:

1. First, Make Sure Your AJAX Request Passes the Right Data #

Your frontend dropdown needs to tie directly to the specific cart item it's modifying. Add a data-item-key attribute to each dropdown (this key uniquely identifies the cart item in WooCommerce's session):

jQuery(document).ready(function($) {
    // Target your product selection dropdowns
    $('.checkout-product-select').change(function() {
        const itemKey = $(this).data('item-key');
        const newProductId = parseInt($(this).val());
        const customMeta = $(this).data('custom-meta'); // Your stored metadata

        $.ajax({
            url: wc_checkout_params.ajax_url,
            type: 'POST',
            data: {
                action: 'update_checkout_cart_item',
                item_key: itemKey,
                product_id: newProductId,
                custom_meta: customMeta,
                security: wc_checkout_params.update_order_review_nonce
            },
            success: function(response) {
                if (response.success) {
                    // Trigger WooCommerce's built-in order review refresh
                    $(document.body).trigger('update_checkout');
                }
            },
            error: function(xhr) {
                console.error('Cart update failed:', xhr.responseText);
            }
        });
    });
});

2. Backend AJAX Handler to Modify the Cart #

Add this to your theme's functions.php or a custom plugin. This function will validate the request, remove the old cart item, and add the new one with your custom metadata:

// Register AJAX actions for logged-in and guest users
add_action('wp_ajax_update_checkout_cart_item', 'update_checkout_cart_item');
add_action('wp_ajax_nopriv_update_checkout_cart_item', 'update_checkout_cart_item');

function update_checkout_cart_item() {
    // Validate security nonce first
    if (!wp_verify_nonce($_POST['security'], 'woocommerce-update-order-review')) {
        wp_send_json_error('Invalid security token.');
    }

    // Sanitize and retrieve request data
    $itemKey = sanitize_text_field($_POST['item_key']);
    $newProductId = intval($_POST['product_id']);
    $customMeta = isset($_POST['custom_meta']) ? array_map('sanitize_text_field', $_POST['custom_meta']) : [];

    if (empty($itemKey) || $newProductId === 0) {
        wp_send_json_error('Missing required parameters.');
    }

    global $woocommerce;
    $cart = $woocommerce->cart;

    // Remove the existing cart item
    if (!$cart->remove_cart_item($itemKey)) {
        wp_send_json_error('Failed to locate cart item.');
    }

    // Prepare custom metadata for the new cart item (matches your existing woocommerce_add_cart_item_data logic)
    $cartItemData = [];
    if (!empty($customMeta)) {
        $cartItemData['your_custom_meta_key'] = $customMeta; // Use your actual meta key here
    }

    // Add the new product to the cart with metadata
    $cart->add_to_cart($newProductId, 1, 0, [], $cartItemData);

    // Recalculate totals and update session
    $cart->calculate_totals();
    $cart->set_session();

    wp_send_json_success('Cart item updated successfully.');
}

3. Ensure update_order_review Reflects Changes #

WooCommerce's update_order_review function automatically refreshes the order review table when you trigger update_checkout, but you need to make sure your custom metadata shows up in the table. Add this filter to display your metadata:

add_filter('woocommerce_cart_item_name', 'display_custom_meta_in_order_review', 10, 3);
function display_custom_meta_in_order_review($itemName, $cartItem, $cartItemKey) {
    if (isset($cartItem['your_custom_meta_key'])) {
        $metaHtml = '<br><small class="custom-meta">';
        foreach ($cartItem['your_custom_meta_key'] as $key => $value) {
            $metaHtml .= esc_html($key) . ': ' . esc_html($value) . ' ';
        }
        $metaHtml .= '</small>';
        $itemName .= $metaHtml;
    }
    return $itemName;
}

Key Notes for Success #

• Cart Item Key: Never skip passing the item_key—it's the only way WooCommerce knows which cart line item to modify.
• Nonce Validation: Always validate the WooCommerce-provided nonce to prevent CSRF attacks.
• Session Updates: After modifying the cart, call calculate_totals() and set_session() to ensure the changes persist across the checkout flow.

内容的提问来源于stack exchange，提问作者Harendra Singh