根据免费送货条件隐藏Woocommerce结帐自定义字段 [英] Conditionally hide Woocommerce checkout custom field based on free shipping

查看:51
本文介绍了根据免费送货条件隐藏Woocommerce结帐自定义字段的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在WooCommerce中,无论何时选择免费送货"(根据订单金额自动选择),我都试图隐藏一个自定义添加的字段.

我本以为我找到了下面的代码解决方案,但是当我在新的(隐身)浏览器窗口中加载页面时,该字段存在,如果刷新它,该字段将再次隐藏

<预> <代码>//隐藏地址字段,当选择免费送货模式add_filter('woocommerce_checkout_fields','xa_remove_billing_checkout_fields');函数xa_remove_billing_checkout_fields($ fields){$ shipping_method ='free_shipping:5';//设置所需的送货方式以隐藏结帐字段.全球$ woocommerce;$ chosen_methods = WC()-> session-> get('chosen_shipping_methods');$ chosen_shipping = $ chosen_methods [0];如果($ chosen_shipping == $ shipping_method){unset($ fields ['billing'] ['billing_field_432']);//添加/更改要隐藏的文件名}返回$ fields;}

感谢您的帮助.

解决方案

由于这是一个实时事件,因此您需要使用javascript/jQuery使其生效.不需要您的"billing_field_432",因为当字段被隐藏并尝试提交订单时,将为此自定义结帐字段抛出错误通知消息.

基于"free_shipping:5"运输方法显示/隐藏该字段的代码:

 //有条件根据选择的运输方式显示隐藏结帐字段add_action('wp_footer','conditionally_hidding_billing_custom_field');函数conditionally_hidding_billing_custom_field(){//仅在结帐页面上if(!is_checkout())返回;//在这里,您的送货方式费率ID为免费送货"$ free_shipping ='free_shipping:5';?>< script>jQuery(函数($){//选择运输方式选择器var sm ='input [name ^ ="shipping_method"]',smc = sm +':checked',cbf ='#billing_field_432_field',ihc ='input [name ="hidden_​​check"]';//显示或隐藏插补选择字段的函数函数showHide(选择器='',操作='显示'){if(动作=='显示')$(selector).show(200,function(){$(this).addClass("validate-required");$(ihc).val('1');//为结帐流程设置隐藏字段});别的$(selector).hide(200,function(){$(this).removeClass("validate-required");$(ihc).val('');//为结帐流程设置隐藏字段});$(selector).removeClass("woocommerce-validated");$(selector).removeClass("woocommerce-invalid woocommerce-invalid-required-field");}//初始化:如果选择的送货方式是免费送货"方式,则隐藏if($(smc).val()=='<?php echo $ free_shipping;?>')showHide(cbf,'hide');别的$(ihc).val('1');//为结帐流程设置隐藏字段//现场活动(更改送货方式后):根据免费送货"方法显示或隐藏$('form.checkout').on('change',sm,function(){if($(smc).val()=='<?php echo $ free_shipping;?>')showHide(cbf,'hide');别的showHide(cbf);});});</script><?php} 

添加自定义签出隐藏输入字段以启用'billing_field_432'未隐藏时启用必需"字段选项检查过程的代码:

 //为必需"选项检查过程添加一个隐藏的输入字段add_filter('woocommerce_checkout_fields','add_custom_hidden_​​input_field');函数add_custom_hidden_​​input_field($ fields){echo'< input type ="hidden" id ="hidden_​​check" name ="hidden_​​check" value =">';返回$ fields;}//未隐藏时检查自定义结帐字段"billing_field_432"add_action('woocommerce_checkout_process','check_custom_field_checkout_process');函数check_custom_field_checkout_process(){//检查是否设置,如果未设置,则添加错误.if(isset($ _POST ['hidden_​​check'])&& $ _POST ['hidden_​​check']&& empty($ _POST ['billing_field_432'])))wc_add_notice(__('请在计费字段432"中输入内容.'),'error');//设置您的自定义错误通知} 

此代码位于您的活动子主题(或主题)的function.php文件中.经过测试,可以正常工作.

它基于:根据选择的送货方式有条件地在WooCommerce中隐藏结帐"字段


由于您使用的是最低订购金额为"50"的免费送货方式,并且 .您应该改用以下方法:

 //基于购物车金额的未结帐字段免运费add_filter('woocommerce_checkout_fields','remove_checkout_billing_field_432',999);函数remove_checkout_billing_field_432($ fields){if(WC()-> cart-> cart_contents_total> = 50){unset($ fields ['billing'] ['billing_field_432']);//未设定栏位}返回$ fields;} 

此代码位于您的活动子主题(或主题)的function.php文件中.经过测试,可以正常工作.

In WooCommerce, I am trying to hide one custom added field whenever "free delivery" is selected (automatic selection, based on order amount).

I was thinking that I found a solution with code below, but when I load a page on new (incognito) browser window, the field is present and if refresh it, the field is hidden again.

// Hide address field, when Free Shipping mode is selected
add_filter('woocommerce_checkout_fields', 'xa_remove_billing_checkout_fields');

function xa_remove_billing_checkout_fields($fields) {
    $shipping_method ='free_shipping:5'; // 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_field_432']); // Add/change filed name to be hide
    }
    return $fields;
}

Any help is appreciated.

解决方案

As it's a live event, you need to use javascript/jQuery to make it work. Your "billing_field_432" has to be not required, because when field is hidden and trying to submit the order, will throw an error notice message for this custom checkout field.

The code to show / hide that field based on 'free_shipping:5' Shipping method:

// Conditional Show hide checkout fields based on chosen shipping methods
add_action( 'wp_footer', 'conditionally_hidding_billing_custom_field' );
function conditionally_hidding_billing_custom_field(){
    // Only on checkout page
    if( ! is_checkout() ) return;

    // HERE your shipping methods rate ID "Free shipping"
    $free_shipping = 'free_shipping:5';
    ?>
    <script>
        jQuery(function($){
            // Choosen shipping method selectors slug
            var sm  = 'input[name^="shipping_method"]',
                smc = sm + ':checked',
                cbf = '#billing_field_432_field',
                ihc = 'input[name="hidden_check"]';

            // Function that shows or hide imput select fields
            function showHide( selector = '', action = 'show' ){
                if( action == 'show' )
                    $(selector).show( 200, function(){
                        $(this).addClass("validate-required");
                        $(ihc).val('1'); // Set hidden field for checkout process
                    });
                else
                    $(selector).hide( 200, function(){
                        $(this).removeClass("validate-required");
                        $(ihc).val(''); // Set hidden field for checkout process
                    });
                $(selector).removeClass("woocommerce-validated");
                $(selector).removeClass("woocommerce-invalid woocommerce-invalid-required-field");
            }

            // Initialising: Hide if choosen shipping method is "Free Shipping" method
            if( $(smc).val() == '<?php echo $free_shipping; ?>' )
                showHide( cbf, 'hide' );
            else
                $(ihc).val('1'); // Set hidden field for checkout process

            // Live event (When shipping method is changed): Show or Hide based on "Free Shipping" method
            $( 'form.checkout' ).on( 'change', sm, function() {
                if( $(smc).val() == '<?php echo $free_shipping; ?>' )
                    showHide( cbf, 'hide' );
                else
                    showHide( cbf );
            });
        });
    </script>
    <?php
}

The code to add a custom checkout hidden input field to enable the "required" field option check process when 'billing_field_432' is not hidden:

// Add a hidden input field for "required" option check process
add_filter('woocommerce_checkout_fields', 'add_custom_hidden_input_field' );
function add_custom_hidden_input_field( $fields ) {

    echo '<input type="hidden" id="hidden_check" name="hidden_check" value="">';

    return $fields;
}

// Check custom checkout field "billing_field_432" when not hidden
add_action('woocommerce_checkout_process', 'check_custom_field_checkout_process');
function check_custom_field_checkout_process() {
    // Check if set, if its not set add an error.
    if ( isset( $_POST['hidden_check'] ) && $_POST['hidden_check'] && empty( $_POST['billing_field_432'] ) )
        wc_add_notice( __( 'Please enter something in "billing field 432".' ), 'error' ); // SET your custom error notice
}

This code goes on function.php file of your active child theme (or theme). Tested and works.

It's based on: Conditionally hide a Checkout field in WooCommerce based on chosen shipping


As you are using free shipping method with a minimum order amount of "50" and hiding other shipping methods when "free shipping" is available. You should use this instead:

// Unset checkout field based on cart amount for free shipping
add_filter('woocommerce_checkout_fields', 'remove_checkout_billing_field_432', 999 );
function remove_checkout_billing_field_432( $fields ) {
    if ( WC()->cart->cart_contents_total >= 50 ) {
        unset($fields['billing']['billing_field_432']); // Unset field
    }
    return $fields;
}

This code goes on function.php file of your active child theme (or theme). Tested and works.

这篇关于根据免费送货条件隐藏Woocommerce结帐自定义字段的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆