0

I'm trying to add multiple checkboxes linked to different products on woocommerce checkout page. the goal: when any of the boxes are checked, the corresponding product gets added to the order via ajax.

Here's my code

// Display a custom checkout fields
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_content1', array(
        'type'          => 'checkbox',
        'label'         => '  ' . __('Add-on 1'),
        'class'         => array('form-row-wide', 'add_c_on'),
    ), $value == 'yes' ? true : false );
    woocommerce_form_field( 'cb_add_content2', array(
        'type'          => 'checkbox',
        'label'         => '  ' . __('Add-on 2'),
        'class'         => array('form-row-wide', 'add_c_on'),
    ), $value == 'yes' ? true : false );
    woocommerce_form_field( 'cb_add_content3', array(
        'type'          => 'checkbox',
        'label'         => '  ' . __('Add-on 3'),
        'class'         => array('form-row-wide', 'add_c_on'),
    ), $value == 'yes' ? true : false );
    woocommerce_form_field( 'cb_add_content4', array(
        'type'          => 'checkbox',
        'label'         => '  ' . __('Add-on 4'),
        'class'         => array('form-row-wide', 'add_c_on'),
    ), $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', 'input.add_c_on').each(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_ids = array("3711", "3733", "3755", "3757");

    if( WC()->session->get('add_a_product') == 'yes' && ! WC()->session->get('product_added_key') )
    {
        $cart_item_key = $cart->add_to_cart( $product->get_id(), $product_ids );
        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');
    }
}

My code is based on the answer for a similar question for adding only a single checkbox, which works well. Here's the link to the question:

Checkbox field that add to cart a product in Woocommerce checkout page

0 Answers0