Woocommerce 结帐页面中的运输承运人自定义字段验证

2021-12-22 00:00:00 jquery php wordpress woocommerce shipping-method

我通过更改模板 /genesis-sample/woocommerce/checkout/review-order.php 在运输方式部分添加了两个自定义输入字段我也设法让他们有条件地要求.只有当特定的单选按钮被选中时，输入字段才会出现并成为必需的.我正在使用 jQuery 代码使字段出现和消失.所有这些都运行良好.代码在这里:

if ( isset($_POST['shipping_method_0_legacy_local_pickup']) && $_POST['shipping_method_0_legacy_local_pickup'] == 1 ) {$cheq = '真';}别的 {$cheq = '假';}woocommerce_form_field( 'fieldtester1' , array('类型' =>'文本'，'类' =>数组('wccs-field-class wccs-form-row-wide blahblah1')，'标签' =>'输入您的运营商名称','必需' =>$支票，'占位符' =>'运营商名称',), $checkout->get_value('fieldtester1'));woocommerce_form_field( 'fieldtester2' , array('类型' =>'文本'，'类' =>数组('wccs-field-class wccs-form-row-wide blahblah2')，'标签' =>'输入您的运营商帐户#','必需' =>$支票，'占位符' =>'承运人号码',), $checkout->get_value('fieldtester2'));

但这里的问题是，即使 required 属性设置为 true 两个字段，如果 时字段为空，则验证不会发生>下订单按钮被按下.理想情况下，订单不应通过，并应生成错误消息.我已经在 functions.php 中添加了以下代码来强制验证输入字段，但它没有做任何事情.代码在这里:

add_action('woocommerce_checkout_process', 'carrier_checkout_process');函数carrier_checkout_process() {if ( isset($_POST['shipping_method_0_legacy_local_pickup']) && $_POST['shipping_method_0_legacy_local_pickup'] == 1 ) {如果(空($_POST['fieldtester1'])){wc_add_notice( ("请不要忘记输入您的承运人详细信息."), "错误");}}}

所以，这就是我要找的:

  1. 谁能帮我强制验证我的两个输入字段添加了吗?
  2. 验证后，我还想在新订单电子邮件中添加这两个字段，并在 Wordpress 仪表板中添加订单详细信息.

如果您想知道为什么我不首先使用 woocommerce 结帐字段挂钩来添加输入字段...我没有将字段添加到结帐表单中，因此挂钩没有任何帮助.这些字段添加在运输方式部分.另一个原因是，我想在每次用户切换运输方式时更新 required 属性.使用 Jquery 更改 required 属性无论出于何种原因都不起作用，相信我，我尝试了两天.无论如何，那部分已经在工作了.唯一的问题是让字段进行验证并将它们添加到订单电子邮件和订单详细信息中.我四处看了看，我得到的最接近的帮助是这篇文章

选择本地取件"时显示:

I have added two custom input fields in the shipping method section by changing the template /genesis-sample/woocommerce/checkout/review-order.php I have also managed to get them conditionally required. Only when the specific radio button is checked, the input fields appear and become required. I am using jQuery code to make the fields appear and disappear. All of this is working fine. The code is here:

if ( isset($_POST['shipping_method_0_legacy_local_pickup']) && $_POST['shipping_method_0_legacy_local_pickup'] == 1 ) {
    $cheq = 'true';
}
else {
    $cheq = 'false';
}
woocommerce_form_field( 'fieldtester1' , array(
    'type'          => 'text',
    'class'         => array('wccs-field-class wccs-form-row-wide blahblah1'), 
    'label'         => 'Enter Your Carrier Name',
    'required'  => $cheq,
    'placeholder'       => 'Carrier Name',
    ), $checkout->get_value( 'fieldtester1' )); 
woocommerce_form_field( 'fieldtester2' , array(
    'type'          => 'text',
    'class'         => array('wccs-field-class wccs-form-row-wide blahblah2'), 
    'label'         => 'Enter Your Carrier Account #',
    'required'  => $cheq,
    'placeholder'       => 'Carrier Number',
    ), $checkout->get_value( 'fieldtester2' ));

But here's the problem, even with the required attribute set as true for the two fields, the validation doesn't happen if the field is empty when the Place Order button is pressed. Ideally, the order should not go through and an error message should be generated. I have already added following code in functions.php to force validation of the input field but it doesn't do a thing. The code is here:

add_action('woocommerce_checkout_process', 'carrier_checkout_process');
function carrier_checkout_process() {
    if ( isset($_POST['shipping_method_0_legacy_local_pickup']) && $_POST['shipping_method_0_legacy_local_pickup'] == 1 ) {
        if( empty( $_POST['fieldtester1'] ) ) {
            wc_add_notice( ( "Please don't forget to enter your shipping carrier details." ), "error" );
        }
    }
}

So, here's what I am looking for:

  1. can anyone help me in forcing the validation for two input fields I have added?
  2. After the validation, I would also like to add these two fields in the new order email, and order details in the Wordpress dashboard.

If you are wondering why I am not using a woocommerce checkout field hook to add the input fields in the first place...I am not adding the fields to the checkout form so the hooks aren't of any help. The fields are added in the shipping method section. Another reason was, I wanted to update the required attribute every time a user would switch the shipping method. Using Jquery to change the required attribute wasn't working for whatever reason, believe me I tried for two days. Anyways, that part is already working. The only issues are getting the fields to validate and add them to the order emails and order details. I have looked around everywhere and the closest help I got was this post where LoicTheAztec gave a detailed solution

解决方案

This can be done without jQuery using a special hook that will display your two "Carrier" custom fields below legacy_local_pickup shipping method when it's selected. If customer change to a different shipping method, those fields will be removed.

So you should need to remove your customized template and all related code before.

Now the validation works perfectly and when "Carrier" custom fields are filled, they are saved in order meta data.

// Add custom fields to a specific selected shipping method
add_action( 'woocommerce_after_shipping_rate', 'carrier_custom_fields', 20, 2 );
function carrier_custom_fields( $method, $index ) {
    if( ! is_checkout()) return; // Only on checkout page

    $customer_carrier_method = 'legacy_local_pickup';

    if( $method->id != $customer_carrier_method ) return; // Only display for "local_pickup"

    $chosen_method_id = WC()->session->chosen_shipping_methods[ $index ];

    // If the chosen shipping method is 'legacy_local_pickup' we display
    if($chosen_method_id == $customer_carrier_method ):

    echo '<div class="custom-carrier">';

    woocommerce_form_field( 'carrier_name' , array(
        'type'          => 'text',
        'class'         => array('form-row-wide carrier-name'),
        'label'         => 'Carrier Information:',
        'required'      => true,
        'placeholder'   => 'Carrier Name',
    ), WC()->checkout->get_value( 'carrier_name' ));

    woocommerce_form_field( 'carrier_number' , array(
        'type'          => 'text',
        'class'         => array('form-row-wide carrier-number'),
        'required'      => true,
        'placeholder'   => 'Carrier Number',
    ), WC()->checkout->get_value( 'carrier_number' ));

    echo '</div>';
    endif;
}

// Check custom fields validation
add_action('woocommerce_checkout_process', 'carrier_checkout_process');
function carrier_checkout_process() {
    if( isset( $_POST['carrier_name'] ) && empty( $_POST['carrier_name'] ) )
        wc_add_notice( ( "Please don't forget to enter the shipping carrier name." ), "error" );

    if( isset( $_POST['carrier_number'] ) && empty( $_POST['carrier_number'] ) )
        wc_add_notice( ( "Please don't forget to enter the shipping carrier account number." ), "error" );
}

// Save custom fields to order meta data
add_action( 'woocommerce_checkout_update_order_meta', 'carrier_update_order_meta', 30, 1 );
function carrier_update_order_meta( $order_id ) {
    if( isset( $_POST['carrier_name'] ))
        update_post_meta( $order_id, '_carrier_name', sanitize_text_field( $_POST['carrier_name'] ) );

    if( isset( $_POST['carrier_number'] ))
        update_post_meta( $order_id, '_carrier_number', sanitize_text_field( $_POST['carrier_number'] ) );
}

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

Not displayed:

Displayed when "Local Pickup" is selected:

相关文章