必需的自定义 WooCommerce 结帐字段不验证输入的值

Question

我正在店面子主题functions.php文件中添加 WooCommerce 自定义结帐字段。
它们具有“必需”属性。
目的是让这些字段出现在页面顶部，在计费字段之前。

单击提交按钮继续付款时，我收到所需的自定义字段验证错误（“请填写您的姓名”）并且无法继续付款，即使使用有效数据填充该字段也是如此。

任何线索如何解决这个问题或从哪里开始调试？

这是代码functions.php：

add_action( 'woocommerce_before_checkout_form', 'my_custom_checkout_fields' );

function my_custom_checkout_fields( $checkout ) {

    echo '<div id="my_custom_checkout_field" class="col4-set"><h2>' . __('name') . '</h2>';

    woocommerce_form_field( 'developer_name', array(
        'type'          => 'text',
        'class'         => array('developer_name-class form-row form-row-first'),
        'label'         => __('name'),
        'placeholder'   => __('fill in your name'), 
        'required'      => true,
        ), $checkout->get_value( 'developer_name' ));                               

    echo '</div>';

}

/**
 * Process the checkout
 */
add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');

function my_custom_checkout_field_process() {
    // Check if set, if its not set add an error.
if ( ! $_POST['developer_name'] )
        wc_add_notice( __( 'please fill in your name' ), 'error' );  
}

---

我尝试了以下但没有一个帮助：

1.变化：

add_action( 'woocommerce_before_checkout_form', 'my_custom_checkout_fields' );

function my_custom_checkout_fields( $checkout ) {

    echo '<div id="my_custom_checkout_field" class="col4-set"><h2>' . __('name') . '</h2>';

    woocommerce_form_field( 'developer_name', array(
        'type'          => 'text',
        'class'         => array('developer_name-class form-row form-row-first'),
        'label'         => __('name'),
        'placeholder'   => __('fill in your name'), 
        'required'      => true,
        ), $checkout->get_value( 'developer_name' ));                               

    echo '</div>';

}

/**
 * Process the checkout
 */
add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');

function my_custom_checkout_field_process() {
    // Check if set, if its not set add an error.
if ( ! $_POST['developer_name'] )
        wc_add_notice( __( 'please fill in your name' ), 'error' );  
}

到

if ( empty( $_POST['developer_name']) )

2. 改变触发器：

if ( ! $_POST['developer_name'] ) 

到

add_action( 'woocommerce_after_checkout_form', 'my_custom_checkout_fields' );

3. 更新到最新的 Woocomerce 3.0.5 版本

我正在运行 Wordpress 4.7.4
其他相关的活动插件：
Uni CPO - WooCommerce 选项和价格计算公式

Answer 1

正如您可以在woocommerce_before_checkout_form钩子中阅读的那样，它在结帐表格之前（因此在结帐表格之外）。出于这个原因，这个自定义字段不能在这个 hook 中工作。

您可以改用woocommerce_checkout_update_order_meta动作钩子，对代码进行一些小改动，因为其中没有可用的 $checkout 参数。

这将显示字段“在页面顶部，在计费字段之前” ......

所以你的完整代码现在应该是：

/**
 * Add the field to the checkout
 */
add_action( 'woocommerce_checkout_before_customer_details', 'my_custom_checkout_fields' );

function my_custom_checkout_fields() {

    echo '<div id="my_custom_checkout_field" class="col4-set"><h2>' . __('name') . '</h2>';

    woocommerce_form_field( 'developer_name', array(
        'type'          => 'text',
        'class'         => array('developer_name-class form-row form-row-first'),
        'label'         => __('name'),
        'placeholder'   => __('fill in your name'),
        'required'      => true,
    ), WC()->checkout->get_value( 'developer_name' ));

    echo '</div>';

}

/**
 * Process the checkout
 */
add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');

function my_custom_checkout_field_process() {
    // Check if set, if its not set add an error.
    if ( ! $_POST['developer_name'] )
        wc_add_notice( __( 'Please fill in your name.' ), 'error' );
}


// Update the order meta with field value
add_action( 'woocommerce_checkout_update_order_meta', 'my_custom_checkout_field_update_order_meta', 10, 1 );
function my_custom_checkout_field_update_order_meta( $order_id ) {
    if ( ! empty( $_POST['developer_name'] ) ) {
        update_post_meta( $order_id, 'Developer name', sanitize_text_field( $_POST['developer_name'] ) );
    }
}

// Display the custom-field in orders view
add_action( 'woocommerce_order_details_after_customer_details', 'display_my_custom_field_in_orde_details', 10, 1 );
function display_my_custom_field_in_orde_details( $order ) {

    $developer_name = get_post_meta( $order->get_id(), 'Developer name',  true );

    if ( ! empty( $developer_name ) ):
    ?>
        <table class="woocommerce-table woocommerce-table--customer-details shop_table customer_details">
            <tbody><tr>
                <th>Developer name:</th>
                <td><?php echo $developer_name; ?></td>
            </tr></tbody>
        </table>
    <?php
    endif;
}

此代码位于活动子主题（或主题）的 function.php 文件或任何插件文件中。

此代码经过测试，适用于 WooCommerce 3.0+ 版