根据所选送货条件,有条件地在WooCommerce中隐藏“结帐"字段 [英] Conditionally hide a Checkout field in WooCommerce based on chosen shipping
问题描述
在WooCommerce中,无论何时选择送货上门",我都试图隐藏公司名称字段.我尝试了很多不同的事情.
in WooCommerce, I am trying to hide the company name field whenever "delivery to home" is selected. I've tried a bunch of different things.
这是我最后一次尝试:
add_filter('woocommerce_checkout_fields', 'xa_remove_billing_checkout_fields');
function xa_remove_billing_checkout_fields($fields) {
$shipping_method ='pakkelabels_shipping_gls1'; // 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_company']); // Add/change filed name to be hide
}
return $fields;
}
但是它所做的就是将运输公司从第一个字段移到最后一个字段.
But all it does is move the Shipping company from the first field to the last.
如何根据选择的送货方式有条件地隐藏特定的结帐字段?
How can I conditionally hide a specific checkout field based on chosen shipping method?
推荐答案
由于这是一个实时事件,因此您需要使用javascript/jQuery使其生效.必须像默认的WooCommerce结帐页面一样,不需要发单公司.
As it's a live event, you need to use javascript/jQuery to make it work. The Billing company has to be not required like in default WooCommerce checkout page.
下面的代码将隐藏结算公司"字段,当选择送货上门"运送:
The following code will hide the "Billing company" field, when "Home delivery" shipping is chosen:
// Conditional Show hide checkout fields based on chosen shipping methods
add_action( 'wp_footer', 'conditionally_hidding_billing_company' );
function conditionally_hidding_billing_company(){
// Only on checkout page
if( ! is_checkout() ) return;
// HERE your shipping methods rate ID "Home delivery"
$home_delivery = 'pakkelabels_shipping_gls1';
?>
<script>
jQuery(function($){
// Choosen shipping method selectors slug
var shipMethod = 'input[name^="shipping_method"]',
shipMethodChecked = shipMethod+':checked';
// Function that shows or hide imput select fields
function showHide( actionToDo='show', selector='' ){
if( actionToDo == '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 shipping method is "Home delivery"
if( $(shipMethodChecked).val() == '<?php echo $home_delivery; ?>' )
showHide('hide','#billing_company_field' );
// Live event (When shipping method is changed)
$( 'form.checkout' ).on( 'change', shipMethod, function() {
if( $(shipMethodChecked).val() == '<?php echo $home_delivery; ?>' )
showHide('hide','#billing_company_field');
else
showHide('show','#billing_company_field');
});
});
</script>
<?php
}
代码会出现在您活动的子主题(或主题)的function.php文件中,也可能会出现在任何插件文件中.
经过测试,可以正常工作.
Tested and works.
这篇关于根据所选送货条件,有条件地在WooCommerce中隐藏“结帐"字段的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!