2
votes

Hello so I'm trying to figure out how to remove some billing fields using woocommerce checkout depending on the shipping method selected. So with this code I'm trying to unset the billing address, billing city, billing state and billing postcode when the customer selects local shipping but this code isn't working. Any help would be appreciated.

add_filter('woocommerce_checkout_fields', 'xa_remove_billing_checkout_fields');

function xa_remove_billing_checkout_fields($fields) {
$shipping_method ='local_pickup:1'; // Set the desired shipping method to hide the checkout field(s).

global $woocommerce;
$chosen_methods = WC()->session->get( 'chosen_shipping_methods' );
$chosen_shipping = $chosen_methods[0];

if ($chosen_shipping == $shipping_method) {
    unset($fields['billing']['billing_address_1']); // Add/change filed name to be hide
    unset($fields['billing']['billing_address_2']);
    unset($fields['billing']['billing_city']);
    unset($fields['billing']['billing_state']);
    unset($fields['billing']['billing_postcode']);
}
return $fields;
}
1
This should work on from cart to checkout page. But will not work on checkout page alone without reloading the page.Reigel
so you feel the code is correct? I've selected local pickup from cart then proceed to checkout but the fields are still there.user2012105
try putting print_r($chosen_methods); and see if it's really 'local_pickup:1'... because mine is not 1 in there.Reigel
got it, it was 3. thanksuser2012105
so i placed the code in my functions.php but you're right when I select on the shipping method on the cart page then it works but when I change while on the checkout it doesn't change, im guessing I need to add some java or jquery?user2012105

1 Answers

4
votes

Here's how I would go about solving this problem.
This will involve php, css, and javascript (jQuery).

PHP

add_filter( 'woocommerce_checkout_fields', 'xa_remove_billing_checkout_fields' );
function xa_remove_billing_checkout_fields( $fields ) {
    // change below for the method
    $shipping_method ='local_pickup:1'; 
    // change below for the list of fields
    $hide_fields = array( 'billing_address_1', 'billing_address_2', 'billing_city', 'billing_state', 'billing_postcode' );

    $chosen_methods = WC()->session->get( 'chosen_shipping_methods' );
    // uncomment below line and reload checkout page to check current $chosen_methods
    // print_r($chosen_methods);
    $chosen_shipping = $chosen_methods[0];

    foreach($hide_fields as $field ) {
        if ($chosen_shipping == $shipping_method) {
            $fields['billing'][$field]['required'] = false;
            $fields['billing'][$field]['class'][] = 'hide';
        }
        $fields['billing'][$field]['class'][] = 'billing-dynamic';
    }

    return $fields;
}

Instead of unsetting the fields, we will just alter it's requiredness. That means, if the chosen method is the one we want to check, we will not make it required. Then we will add a hide class. With this, we can hide these fields using css. And woocommerce will not throw an error that it is required. Using jQuery, we can show/hide these fields. So if we unset it on the first run, there's nothing to show because the fields are not there in the first place and with that the page needs to reload.

So here's the javascript and the css part.

add_action( 'wp_footer', 'cart_update_script', 999 );
function cart_update_script() {
    if (is_checkout()) :
    ?>
    <style>
        .hide {display: none!important;}
    </style>
    <script>
        jQuery( function( $ ) {

            // woocommerce_params is required to continue, ensure the object exists
            if ( typeof woocommerce_params === 'undefined' ) {
                return false;
            }

            $(document).on( 'change', '#shipping_method input[type="radio"]', function() {
                // change local_pickup:1 accordingly 
                $('.billing-dynamic').toggleClass('hide', this.value == 'local_pickup:1');
            });
        });
    </script>
    <?php
    endif;
}