Customize a checkout field if there are applied coupons in WooCommerce

Viewed 793

In need to control the order notes checkout field if a coupon is applied in Woocommerce: I have tried this will no success.

add_action('woocommerce_applied_coupon', 'apply_product_on_coupon');
function apply_product_on_coupon( ) {
    if (WC()->cart->has_discount('test')) {
        $fields['billing']['billing_customer_note']['placeholder'] = 'You can have up to three initials';
        $fields['billing']['billing_customer_note']['label'] = 'Personalise your Tote bag';
        $fields['billing']['billing_customer_note']['required'] = true;
        $fields['billing']['billing_customer_note']['input_class'] = array('tote-bag');
    }
    return $fields;
}

I know the $fields bit works as I have used this in a different scenario. If we assume that the coupon code is 'test' I need the order notes to be mandatory, the label and placeholder changed and some additional CSS classes applied.

Any suggestions?

2 Answers

Please try with this code. Add this code in your active theme functions.php file.

summer is coupon code name. replace with your coupon code name

add_filter('woocommerce_checkout_fields', 'xa_remove_billing_checkout_field');
function xa_remove_billing_checkout_field($fields) {
    global $woocommerce;
    if (!empty(WC()->cart->applied_coupons)){
        if (in_array("summer", WC()->cart->applied_coupons)) {
            $fields['order']['order_comments']['required'] = true;
            $fields['order']['order_comments']['placeholder'] ='custom placeholder';
            $fields['order']['order_comments']['label'] = 'custom label';   
            $fields['order']['order_comments']['input_class'] = array('tote-bag');
        }
    }
    return $fields;
}

Hope is useful for you. Thanks

UPDATE

If you remove coupon from checkout then refresh the page.

function action_woocommerce_removed_coupon( $coupon_code ) { 
    if ($coupon_code == "summer") { ?>
        <script>location.reload();</script>
    <?php }
};
add_action( 'woocommerce_removed_coupon', 'action_woocommerce_removed_coupon', 10, 1 );

As customer can add or remove a coupon in Checkout page, jQuery and Php are required.

Only if a coupon code is applied to the order, the following code will make checkout order notes field required, changing its label and placeholder, and adding tote-bag as selector class to textarea input field. It will handle validation when the field is required.

Use the following code instead:

add_filter('woocommerce_before_checkout_form', 'custom_order_notes_checkout_fields_js');
function custom_order_notes_checkout_fields_js($fields) {
    // Here below set your custom order notes attributes (when a coupon is applied)
    $field_label = __('custom label');
    $placeholder = __('custom placeholder');
    $label       = 'tote-bag';

    $required    = '<abbr class="required" title="required">*</abbr>';

    wc_enqueue_js( "jQuery(function($){
        var required     = '".$required."',
            label        = '".$field_label."',
            placeholder  = '".$placeholder."',
            input_class  = '".$input_class."',
            class_requ   = 'validate-required',
            class_valid  = 'woocommerce-validated',
            class_unval  = 'woocommerce-invalid woocommerce-invalid-required-field',
            notesPara    = '#order_comments_field',
            notesLabel   = notesPara+' label',
            notesText    = notesPara+' textarea',
            defaultLabel = $(notesText).html(),
            defaultPHold = $(notesText).attr('placeholder'),
            newLabel     = label+'&nbsp'+required;

            console.log(defaultPHold);

        if( $('tr.cart-discount').length > 0 ) {
            $(notesPara).addClass(class_requ).addClass(class_valid);
            $(notesLabel).html(newLabel);
            $(notesText).attr('placeholder', placeholder);
        }

        // On order notes change
        $(document.body).on('change input', notesText, function(){
            if( $('tr.cart-discount').length > 0 ) {
                if( $(this).val() != '' ) {
                    $(notesPara).removeClass(class_unval);
                    if ( ! $(notesPara).hasClass(class_valid) ) {
                        $(notesPara).addClass(class_valid);
                    }
                } else {
                    $(notesPara).removeClass(class_valid);
                    if ( ! $(notesPara).hasClass(class_unval) ) {
                        $(notesPara).addClass(class_unval);
                    }
                }
            }
        });

        // On coupon change
        $(document.body).on('updated_checkout', function(){
            if( $('tr.cart-discount').length > 0 ) {
                if( ! $(notesPara).hasClass(class_requ) ) {
                    $(notesPara).addClass(class_requ).addClass(class_valid);
                    $(notesLabel).html(newLabel);
                    $(notesText).addClass(input_class);
                    $(notesText).attr('placeholder', placeholder);
                }
            } else {
                if( $(notesPara).hasClass(class_requ) ) {
                    $(notesPara).removeClass(class_requ).removeClass(class_valid).removeClass(class_unval);
                    $(notesLabel).html(defaultLabel);
                    $(notesText).addClass(input_class);
                    $(notesText).attr('placeholder', defaultPHold);
                }
            }
        });
    });");
}

// Enable "Order notes" field validation for applied coupons
add_filter('woocommerce_checkout_process', 'validation_checkout_required_order_comments');
function validation_checkout_required_order_comments() {
    $applied_coupons = WC()->cart->get_applied_coupons();
    if ( ! empty($applied_coupons) && isset($_POST['order_comments']) && strlen($_POST['order_comments']) < 3 ) {
        wc_add_notice( __("Order comments is a required custom field whan a coupon is applied", "woocommerce"), 'error' );
    }
}

Code goes in functions.php file of the active child theme (or active theme). Tested and works.

Related