Adding this code to your theme's functions.php will be able to hide certain checkout field on the Checkout page by detecting if customer is paying with CASH or CREDIT CARD.
Because it doesn't make sense for us to ask for BILLING ADDRESS if the customer is paying with cash.
Here is the code, just make some changes and then add it to your functions.php
// Conditional Show hide checkout fields based on chosen payment methods
add_action( 'wp_footer', 'conditionally_show_hide_billing_custom_field' );
function conditionally_show_hide_billing_custom_field(){
// Only on checkout page
if ( is_checkout() && ! is_wc_endpoint_url() ) :
?>
<script>
jQuery(function($){
var a = 'input[name="payment_method"]',
b = a + ':checked',
c = '#billing_country_field,#billing_address_1_field,#billing_address_2_field,#billing_city_field,#billing_state_field, #billing_postcode_field'; // The checkout field <p> container selector
// Function that shows or hide checkout fields
function showHide( selector = '', action = 'show' ){
if( action == 'show' )
$(selector).show( 200, function(){
$(this).addClass("validate-required");
});
else
$(selector).hide( 200, function(){
$(this).removeClass("validate-required");
});
$(selector).removeClass("woocommerce-validated");
$(selector).removeClass("woocommerce-invalid woocommerce-invalid-required-field");
}
// Initialising: Hide if choosen payment method is "cod"
if( $(b).val() == 'cod' ){
showHide( c, 'hide' );
}
else
showHide( c );
// Live event (When payment method is changed): Show or Hide based on "cod"
$( 'form.checkout' ).on( 'change', a, function() {
if( $(b).val() == 'cod' ){
showHide( c, 'hide' );
}
else
showHide( c );
});
});
</script>
<?php
endif;
}
//
ADDITIONALLY, you might want to hide only if both CASH and PICKUP are selected by CUSTOMER.
No comments:
Post a Comment