上述问题的答案帮助了我,但我仍然有一个问题:Show hide custom Woocommerce checkout field based on selected payment method

我希望当客户 Select cheque支付网关时显示电话字段(需要一个字段),如果他 Select 其他支付网关,则不显示和禁用移动字段.

// 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_phone_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 "cheque"
            if( $(b).val() !== 'cheque' )
                showHide( c, 'hide' );
            else
                showHide( c );

            // Live event (When payment method is changed): Show or Hide based on "cheque"
            $( 'form.checkout' ).on( 'change', a, function() {
                if( $(b).val() !== 'cheque' )
                    showHide( c, 'hide' );
                else
                    showHide( c );
            });
        });
    </script>
    <?php
    endif;
}

问题是,当我 Select cheque以外的其他支付网关时,即使电话字段被隐藏,它仍然被验证并显示错误(计费电话是必填字段)-and this field needs to be filled, I don't want this!

推荐答案

下面将完成这项工作,添加一个隐藏字段来处理计费电话字段可见时的计费电话验证.当帐单电话字段隐藏且为空时,不会提示验证错误,允许静默下单:

// Your settings goes in here
function my_checkout_settings()
{
    return array(
        'payment_id'   => 'cheque', // The payment Id
        'field_key_id' => 'billing_phone', // The checkout field key ID
    );
}

// Add a hidden billing input field for phone validation purpose
add_action('woocommerce_billing_fields', 'add_an_hidden_billing_fields');
function add_an_hidden_billing_fields($billing_fields) {
    extract(my_checkout_settings()); // Load your settings

    // Add a hidden input field
    $billing_fields[$field_key_id . '_is_valid'] = array(
        'type' => 'hidden',
        'required' => false,
        'default' => '',
    );

    return $billing_fields;
}

// Disabling conditionnally the Billing phone validation
add_action('woocommerce_after_checkout_validation', 'disable_specific_checkout_field_validation_conditionally', 20, 2);
function disable_specific_checkout_field_validation_conditionally($data, $errors) {
    extract(my_checkout_settings()); // Load your settings

    $validation_key =  $field_key_id . '_is_valid'; // The key Id of the hidden field

    if (empty($data[$field_key_id]) && isset($data[$validation_key]) && $data[$validation_key]) {
        $errors->remove($field_key_id . '_required'); // Remove unwanted error for this field
    }
}

// Conditional Show hide billing phone checkout fields based on chosen payment methods
add_action('woocommerce_checkout_init', 'enqueue_checkout_custom_script');
function enqueue_checkout_custom_script() {
    extract(my_checkout_settings()); // Load your settings

    wc_enqueue_js("const a = 'input[name=payment_method]',
        b = a + ':checked',
        c = '#{$field_key_id}',
        d = c + '_field',
        v = c + '_is_valid',
        p = '{$payment_id}';
    
    function triggerShowHide(b, d, p, v) {
        $(b).val() !== p ? $(d).show(200) : $(d).hide(200);
        $(b).val() !== p ? $(v).val('') : $(v).val('1');
    }
    
    // On the first load
     triggerShowHide(b, d, p, v);
    
    // On payment method 'change' live event
    $('form.checkout').on('change', a, function() {
        triggerShowHide(b, d, p, v);
    });");
}

代码放在活动子主题的unctions.php文件中(或在插件中).经过测试,效果良好.

Php相关问答推荐

PHP php_mongodb.dll for 32bit

以编程方式更改新订单、已取消订单和失败订单的邮箱WooCommerce通知

Laravel关系-为用户获取属于组织的所有团队

根据产品类型显示或隐藏WooCommerce管理产品自定义字段

Laravel:测试命令时无法获取工作通知::AssertSentTo

在冲突和几何上插入的Postgres参数化查询在PHP中不起作用

如何实现对数据库表中多列的唯一约束?

我必须对所有的SQL查询使用预准备语句吗?

Symfony 6.2 IsGraned具有多个角色

为什么只有最后一次点击的点赞/心形会按预期改变 colored颜色 ,而其他的保持正常 colored颜色 ?

在个人资料页面上显示个人资料图像

fpm-php + nginx + POST数据

Laravel路由到控制器传输变量解决方案需要

Laravel Http::get not working on controller

从WooCommerce管理订单汇总中隐藏原始小计行

Symfony框架锁定和.env设置

打折时更改 Woocommerce 产品名称

在 WooCommerce 更新结帐事件上动态更新自定义内容

wp_insert_post() 和 WordPress 中查询字符串的多个帖子

根据购买产品的自定义字段替换WooCommerce添加到购物车按钮