wordpress 单选按钮，以选择特定的文本输入在WooCommerce结帐

我正在通过我的子主题的functions.php添加自定义字段到我的WooCommerce结帐区域。我已经添加了一些文本输入，但我需要添加两个单选按钮，将选择/激活两个单独的文本输入“集”。
基本上，我需要一种方法，让我的客户能够选择按钮A：输入付款信息或选择按钮B：并输入一个PO编号。我需要确保未选中的按钮不会写入数据库，并在结帐过程中阻止/产生错误。
如果你去products page并添加一个产品，然后导航到checkout area，你可以看到我已经做了什么。代码如下：

add_action('woocommerce_after_order_notes', 'custom_checkout_field');
function custom_checkout_field( $checkout ) {

echo '<div id="payment_info"><h3>'.__('Payment Information').'</h3>';

woocommerce_form_field( 'credit_card_name', array(
    'type'          => 'text',
    'class'         => array('form-row-wide'),
    'label'         => __('Name on Credit Card'),
    'required'    => true,
    'placeholder'       => __(''),
    ), $checkout->get_value( 'credit_card_name' ));

woocommerce_form_field( 'card_type', array(
    'type'          => 'select',
    'class'         => array(''),
    'label'         => __('Card Type'),
    'required'    => true,
    'placeholder'       => __(''),
    'options'     => array(
    'American Express' => __('American Express'),
    'Discover' => __('Discover'),
    'Mastercard' => __('Mastercard'),
    'Visa' => __('Visa')
    )), $checkout->get_value( 'card_type' ));

woocommerce_form_field( 'card_number', array(
    'type'          => 'text',
    'class'         => array(''),
    'label'         => __('Card Number'),
    'required'    => true,
    'placeholder'       => __('XXXX-XXXX-XXXX-XXXX'),
    ), $checkout->get_value( 'card_number' ));

woocommerce_form_field( 'card_expiration_month', array(
    'type'          => 'select',
    'class'         => array('form-row-first'),
    'label'         => __('Expiration Month'),
    'required'    => true,
    'placeholder'       => __('- Select Month -'),
    'options'     => array(
    '1' => __('1'),
    '2' => __('2'),
    '3' => __('3'),
    '4' => __('4'),
    '5' => __('5'),
    '6' => __('6'),
    '7' => __('7'),
    '8' => __('8'),
    '9' => __('9'),
    '10' => __('10'),
    '11' => __('11'),
    '12' => __('12')
    )), $checkout->get_value( 'card_expiration_month' ));

woocommerce_form_field( 'card_expiration_year', array(
    'type'          => 'select',
    'class'         => array('form-row-last'),
    'label'         => __('Expiration Year'),
    'required'    => true,
    'placeholder'       => __('- Select Year -'),
    'options'     => array(
    '2013' => __('2013'),
    '2014' => __('2014'),
    '2015' => __('2015'),
    '2016' => __('2016'),
    '2017' => __('2017'),
    '2018' => __('2018'),
    '2019' => __('2019'),
    '2020' => __('2020')
    )), $checkout->get_value( 'card_expiration_year' ));

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

woocommerce_form_field( 'order_number', array(
    'type'          => 'text',
    'class'         => array('form-row-wide'),
    'label'         => __('PO Number (if required)'),
    'placeholder'       => __(''),
    ), $checkout->get_value( 'order_number' ));

echo '</div>';

因此，它需要看起来像这样：

付款信息 *

[x]信用卡
名称[ 活动输入区域 ]
卡号[ 活动输入区 ]等
[ _ ]采购订单编号
输入编号[ 非活动输入区域 ]

在woocommerce中，没有钩子可以用这种方式改变你的形式。

**1.**您必须将字段添加到form-billing.php（将woocommerce/templates/checkhout/form-billing.php复制到{yourtheme}/checkout/form-billing.php）。此文件包含一个foreach循环，用于将字段添加到表单。请将自定义字段添加到该循环中或循环之后。示例：

<?php foreach ($checkout->checkout_fields['billing'] as $key => $field) : ?>

    <?php woocommerce_form_field( $key, $field, $checkout->get_value( $key ) ); ?>

<?
if($key=='billing_first_name')
{
?>
<input type="radio" name="gender" value="female">Female
<input type="radio" name="gender" value="male">Male
<?
}
?>

<?php endforeach; ?>

你也可以在这里添加jQuery（在foreach循环之后），根据用户的选择来显示/隐藏一些字段。

<script type="text/javascript">
 jQuery('input[name="gender"]').live('change', function(){ alert('gender checked');});
 </script>

2提交后检查自定义字段的输入。将以下内容添加到functions.php示例中：

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

function my_custom_checkout_field_process() {
    global $woocommerce;
    if($_POST['gender']=='male') 
        {
        $woocommerce->add_error( 'You are a female' );
        }   
}

3将输入添加到数据库，示例：

/**
 * Update the order meta with field value
 **/
add_action('woocommerce_checkout_update_order_meta', 'my_custom_checkout_field_update_order_meta');

function my_custom_checkout_field_update_order_meta( $order_id ) {
    if ($_POST['gender']) update_post_meta( $order_id, 'Gender', esc_attr($_POST['gender']));
}

另请参阅：https://gist.github.com/mikejolley/1604009以取得更多范例程式码

wordpress 单选按钮，以选择特定的文本输入在WooCommerce结帐

1条答案

相关问题

热门标签

最新问答