在 Woocommerce 结帐页面中将产品添加到购物车的复选框字段

Posted 2023-02-24

【中文标题】在 Woocommerce 结帐页面中将产品添加到购物车的复选框字段

【英文标题】：Checkbox field that add to cart a product in Woocommerce checkout page

【发布时间】：2019-05-04 06:13:27

【问题描述】：

在 Woocommerce 结帐部分，我正在尝试添加一个用于添加其他产品的复选框。

我有一段工作代码添加费用并在单击复选框时更新购物车，但我希望它添加产品而不是附加费：

function cart_custom_fee( $cart ) 

    if( !$_POST || ( is_admin() && ! is_ajax() ) ) 
        return;
    

    if( isset( $_POST['post_data'] ) ) 
        parse_str( $_POST['post_data'], $post_data );   
     else 
        $post_data = $_POST;
    

    if( isset( $post_data['add_test_item'] ) )  // This is the checkbox name
        WC()->cart->add_fee('Test Item', 35);
    

add_action( 'woocommerce_cart_calculate_fees', 'cart_custom_fee' );

这是复选框的代码

<script>
             jQuery(document).ready(function()
                   jQuery('#cp-checkbox').click(function() 
                      jQuery('body').trigger('update_checkout'); 
                   );
                );
</script>

而且代码有效……

现在，我尝试更改代码以添加产品：

function add_item_checkout( $cart ) 

    if( !$_POST || ( is_admin() && ! is_ajax() ) ) 
        return;
    

    if( isset( $_POST['post_data'] ) ) 
        parse_str( $_POST['post_data'], $post_data );   
     else 
        $post_data = $_POST;
    

    if( isset( $post_data['add_test_item'] ) )  // This is the checkbox name
        WC()->cart->add_to_cart( 123 ); // 123 is the product ID
    

add_action( 'woocommerce_calculate_totals', 'add_item_checkout' );

但它没有用。任何帮助将不胜感激。

【参考方案1】：

更新 （与您的评论有关）。

这只能使用 javascript (jQuery) 和 Ajax 完成，因为它是客户端事件，在结帐字段上执行操作时不会提交任何内容。

选中此复选框时，特定产品将添加到购物车中，刷新结帐订单评论数据。如果客户未选中该复选框，它将删除特定产品，刷新结帐订单评论数据。

更新更改：我更改了支付选项下的复选框并稍微更改了 jQuery 代码，以处理复选框值，因为它现在也刷新了 Ajax。

代码：

// Display a custom checkout field
add_action( 'woocommerce_checkout_before_terms_and_conditions', 'custom_checkbox_checkout_field' );
function custom_checkbox_checkout_field() 
    $value = WC()->session->get('add_a_product');

    woocommerce_form_field( 'cb_add_product', array(
        'type'          => 'checkbox',
        'label'         => '  ' . __('Add a demo product to your order'),
        'class'         => array('form-row-wide'),
    ), $value == 'yes' ? true : false );



// The jQuery Ajax request
add_action( 'wp_footer', 'checkout_custom_jquery_script' );
function checkout_custom_jquery_script() 
    // Only checkout page
    if( is_checkout() && ! is_wc_endpoint_url() ):

    // Remove custom WC session variables on load
    if( WC()->session->get('add_a_product') )
        WC()->session->__unset('add_a_product');
    
    if( WC()->session->get('product_added_key') )
        WC()->session->__unset('product_added_key');
    
    // jQuery Ajax code
    ?>
    <script type="text/javascript">
    jQuery( function($)
        if (typeof wc_checkout_params === 'undefined')
            return false;

        $('form.checkout').on( 'change', '#cb_add_product', function()
            var value = $(this).prop('checked') === true ? 'yes' : 'no';

            $.ajax(
                type: 'POST',
                url: wc_checkout_params.ajax_url,
                data: 
                    'action': 'add_a_product',
                    'add_a_product': value,
                ,
                success: function (result) 
                    $('body').trigger('update_checkout');
                    console.log(result);
                
            );
        );
    );
    </script>
    <?php
    endif;


// The Wordpress Ajax PHP receiver
add_action( 'wp_ajax_add_a_product', 'checkout_ajax_add_a_product' );
add_action( 'wp_ajax_nopriv_add_a_product', 'checkout_ajax_add_a_product' );
function checkout_ajax_add_a_product() 
    if ( isset($_POST['add_a_product']) )
        WC()->session->set('add_a_product', esc_attr($_POST['add_a_product']));
        echo $_POST['add_a_product'];
    
    die();


// Add remove free product
add_action( 'woocommerce_before_calculate_totals', 'adding_removing_specific_product' );
function adding_removing_specific_product( $cart ) 
    if (is_admin() && !defined('DOING_AJAX'))
        return;

    if ( did_action( 'woocommerce_before_calculate_totals' ) >= 2 )
        return;

    // HERE the specific Product ID
    $product_id = 53;

    if( WC()->session->get('add_a_product') == 'yes' && ! WC()->session->get('product_added_key') )
    
        $cart_item_key = $cart->add_to_cart( $product_id );
        WC()->session->set('product_added_key', $cart_item_key);
    
    elseif( WC()->session->get('add_a_product') == 'no' && WC()->session->get('product_added_key') )
    
        $cart_item_key = WC()->session->get('product_added_key');
        $cart->remove_cart_item( $cart_item_key );
        WC()->session->__unset('product_added_key');
    

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

---

付款方式下的订单项目和复选框自定义字段

启用该复选框时，产品被添加并出现在订单项中：

【讨论】：

我很难让这段代码正常工作。我的复选框位于付款选项下方。如果我在 Remove ship_different custom WC session on load 下注释掉 if( WC()->session->get('add_a_product) ) ，那么它将停止无休止的渲染。

我已经更新了我的代码，做了一些小改动：我移动了支付方式下的复选框，并在与该复选框相关的 jQuery 监听器中做了一些改动。它可以完美运行，没有任何错误或无休止的渲染。

@user2515606 首先，由于此答案有效并且正在回答您最初的问题，请接受它，如果您喜欢/想要投票。然后你可以告诉我你想在哪里添加这个复选框，在你的问题末尾添加一个屏幕截图......然后通知我，我会在我的答案中进行必要的更改。

它工作正常，感谢您的出色帮助。我在 payment.php 中有一个自定义表调用像 ?

@LoicTheAztec 我需要相同的要求，但还需要一个功能，即如果选中复选框并且购物车中有其他产品，我想为每个产品添加动态折扣。有可能吗？