Woocommerce中的条件自定义结帐字段验证问题

时间:2018-02-27 15:32:00

标签: php jquery wordpress woocommerce checkout

我有一个复选框,如果选中则会打开一个下拉字段(要求)。如果您尝试发送Woocommerce订单,它会有条件地检查该字段是否包含内容,如果不是,则返回错误。

当需求字段确实有信息输入时,这一切都可以接受它仍然将其视为没有内容并返回错误。

由于这是表单应该工作的基本方式,我不明白为什么我会得到这样的结果。这是代码:

/**
 * Add a message field to the WC checkout
 */
add_action( 'woocommerce_before_checkout_form', 'custom_checkout_field' );

function custom_checkout_field( $checkout ) {

    echo '<div id="message"><h3>' . __( '<i class="fas fa-envelope"></i> Message' ) . '</h3><p style="margin: 0 0 8px;">Would you like to leave a message?</p>';

        woocommerce_form_field( 'checkbox', array(
            'type'  => 'checkbox',
            'class' => array( 'msg-checkbox' ),
            'label' => __( 'Yes' ),
        ), $checkout->get_value( 'checkbox' ) );

    woocommerce_form_field( 'requirements', array(
        'type'          => 'text',
        'class'         => array('msg'),
        'label'         => __('Please input your message.'),
        'placeholder'   => __(''),
        ), $checkout->get_value( 'requirements' ));

    echo '</div>';

}

/**
 * Process checkout with additional custom field
 */
add_action('woocommerce_checkout_process', 'custom_checkout_field_process');

function custom_checkout_field_process() {

    // Check if set, if not add an error.

    if(isset($_POST['checkbox']) && ( empty($_POST['requirements'])));

        wc_add_notice( __( 'Please let us know what you would like to do' ), 'error' );
}

我希望这是有道理的。基本上它适用于某一点,但输入字段的验证在有内容时不起作用。

感谢。

1 个答案:

答案 0 :(得分:1)

  

更新:代码改进并添加了jQuery的显示/隐藏功能

唯一的问题来自您用于自定义结帐字段的挂钩。它会在结帐表单之外输出这些字段,因此永远不会提交值,然后始终为空。

相反,您将使用woocommerce_checkout_before_customer_details动作挂钩作为您的第一个挂钩函数,这次将在结帐表单中输出字段

// Output custom checkout fields
add_action( 'woocommerce_checkout_before_customer_details', 'custom_checkout_field_before_billing' );
function custom_checkout_field_before_billing() {
    $domain = 'woocommerce';

    // Hide the message text field on load
    ?>
    <style>p#requirements_field{display:none;}</style>

    <div id="message">
    <h3><i class="fa fa-envelope"></i><?php _e( 'Message', 'woocommerce' ); ?></h3>
    <?php

    woocommerce_form_field( 'checkbox_msg', array(
        'type'  => 'checkbox',
        'class' => array( 'msg-checkbox' ),
        'label' => __( 'Would you like to leave a message?', 'woocommerce' ),
    ), WC()->checkout->get_value( 'cb_msg' ));

    woocommerce_form_field( 'requirements', array(
        'type'              => 'text',
        'class'             => array('msg t_msg'),
        'label'             => __('Please input your message.'),
        'placeholder'       => __(''),
    ), WC()->checkout->get_value( 'requirements' ));

    echo '</div>';

    // jQuery: show hide the text requirement field
    ?><script>
    jQuery(document).ready(function($) {
        var a = '#requirements_field';
        $('input#checkbox_msg').change( function(){
            if( $(this).is(':checked') )
                $(a).show();
            else
                $(a).hide();
        });
    });
    </script><?php
}

// Process checkout with additional custom field
add_action('woocommerce_after_checkout_validation', 'custom_checkout_field_validation_process', 20, 2 );
function custom_checkout_field_validation_process( $data, $errors ) {

    // Check if set, if not add an error.
    if( isset($_POST['checkbox_msg']) && empty($_POST['requirements']) )
        $errors->add( 'requirements', __( "Please let us know what you would like to do filling up the message field.", "woocommerce" ) );
}

代码进入活动子主题(或活动主题)的function.php文件。 经过测试和工作。

enter image description here