woocommerce在checkout页面自定义输入内容

前沿

对接第三方支付的过程中，有几个字段需要客户端上传。需要在checkout页面让客户输入然后提交。

自定义输入

代码

上述样式的自定义代码

代码语言：javascript复制

// 添加自定义字段到结账页面
add_action('woocommerce_after_order_notes', 'custom_checkout_fields');

function custom_checkout_fields($checkout)
{
    echo '' . __('Custom Fields') . '';

    woocommerce_form_field('cardNo', array(
        'type' => 'text',
        'class' => array('form-row-wide'),
        'label' => __('Card Number'),
        'required' => true
    ), $checkout->get_value('cardNo'));

    woocommerce_form_field('cardExpireMonth', array(
        'type' => 'text',
        'class' => array('form-row-first'),
        'label' => __('Card Expiry Month'),
        'required' => true
    ), $checkout->get_value('cardExpireMonth'));

    woocommerce_form_field('cardExpireYear', array(
        'type' => 'text',
        'class' => array('form-row-last'),
        'label' => __('Card Expiry Year'),
        'required' => true
    ), $checkout->get_value('cardExpireYear'));

    woocommerce_form_field('cardSecurityCode', array(
        'type' => 'text',
        'class' => array('form-row-wide'),
        'label' => __('Security Code'),
        'required' => true
    ), $checkout->get_value('cardSecurityCode'));

    woocommerce_form_field('cardType', array(
        'type' => 'select',
        'class' => array('form-row-wide'),
        'label' => __('Card Type'),
        'options' => array(
            'visa' => __('VISA'),
            'mastercard' => __('MASTERCARD'),
            'ae' => __('AE')
        ),
        'required' => true
    ), $checkout->get_value('cardType'));

    echo '';
}

// 验证并保存输入的值
add_action('woocommerce_checkout_process', 'custom_checkout_fields_validation');

function custom_checkout_fields_validation()
{
    if (empty($_POST['cardNo'])) {
        wc_add_notice(__('Card Number is a required field.'), 'error');
    }

    if (empty($_POST['cardExpireMonth'])) {
        wc_add_notice(__('Card Expiry Month is a required field.'), 'error');
    }

    if (empty($_POST['cardExpireYear'])) {
        wc_add_notice(__('Card Expiry Year is a required field.'), 'error');
    }

    if (empty($_POST['cardSecurityCode'])) {
        wc_add_notice(__('Security Code is a required field.'), 'error');
    }

    if (empty($_POST['cardType']) || $_POST['cardType'] == '') {
        wc_add_notice(__('Card Type is a required field.'), 'error');
    }
}

// 保存输入的值
add_action('woocommerce_checkout_update_order_meta', 'save_custom_checkout_fields');

function save_custom_checkout_fields($order_id)
{
    if (!empty($_POST['cardNo'])) {
        update_post_meta($order_id, 'Card Number', sanitize_text_field($_POST['cardNo']));
    }
    if (!empty($_POST['cardExpireMonth'])) {
        update_post_meta($order_id, 'Card Expiry Month', sanitize_text_field($_POST['cardExpireMonth']));
    }
    if (!empty($_POST['cardExpireYear'])) {
        update_post_meta($order_id, 'Card Expiry Year', sanitize_text_field($_POST['cardExpireYear']));
    }
    if (!empty($_POST['cardSecurityCode'])) {
        update_post_meta($order_id, 'Security Code', sanitize_text_field($_POST['cardSecurityCode']));
    }
    if (!empty($_POST['cardType'])) {
        update_post_meta($order_id, 'Card Type', wc_clean($_POST['cardType']));
    }
}

checkout field form post woocommerce

0 人点赞