Question

我希望使用select添加三个自定义日期字段。所以第一个是天，第二个是月，第三个是年。但是，我不确定如何在不手动输入所有年份以及将三个字段计为一的情况下添加代码。

我有一个代码，用于将自定义字段“性别”以任何方式添加到上述dob选择字段的类似内容。

add_action('woocommerce_before_checkout_billing_form', 'wps_add_select_checkout_field');

function wps_add_select_checkout_field( $checkout ) {

woocommerce_form_field( 'apgen', array(
    'type'          => 'select',
    'class'         => array( 'ap-drop' ),
    'label'         => __( 'Gender' ),
    'options'       => array(
        'blank'     => __( 'Select Gender', 'ap' ),
        'male'  => __( 'Male', 'ap' ),
        'Female'    => __( 'Female', 'ap' ),
        'non-binary'    => __( 'Non-binary', 'ap' )
    )
),
$checkout->get_value( 'apgen' ));
}

Answer 1

Woocommerce现在具有“日期” 字段类型，具有非常特定的行为，该字段类型在其字段内具有3个可选数字字段类型（日，月和年），您可以分别选择它们，一个可显示的日期选择器（请参见下面的屏幕截图）：

add_filter('woocommerce_checkout_fields', 'wps_add_checkout_field');
function wps_add_checkout_field( $fields ) {


    // Select field (Gender)
    $fields['billing']['billing_gender'] = array(
        'type'     => 'select',
        'class'    => array( 'form-row-wide' ),
        'label'    => __( 'Gender' ),
        'required' => true,
        'priority' => 3,
        'options'  => array(
            ''           => __( 'Select Gender', 'ap' ),
            'male'       => __( 'Male', 'ap' ),
            'Female'     => __( 'Female', 'ap' ),
            'non-binary' => __( 'Non-binary', 'ap' )
        ),
    );

    // Date field (with 3 number fields with a datepicker)
    $fields['billing']['billing_date'] = array(
        'type'     => 'date',
        'class'    => array( 'form-row-wide' ),
        'label'    => __( 'Date' ),
        'required' => true,
        'priority' => 3,
    );

    return $fields;
}

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

您将得到类似的东西：

滚动日期字段：

选择天数，然后使用 enter image description here 来增加或减少天数：

选择月份并增加价值（或输入值）：

选择年份并增加价值（或输入值）：

出现日期选择器 enter image description here 并选择一个日期：

可以使用的其他类似的挂钩：

add_filter('woocommerce_billing_fields', 'wps_add_date_type_checkout_field');

function wps_add_date_type_checkout_field( $fields ) {
// Date field (with 3 number fields with a datepicker)
    $fields['billing_date'] = array(
        'type'          => 'date',
        'class'         => array( 'form-row-wide' ),
        'label'         => __( 'Date' ),
        'priority'      => 5,
    );
    return $fields;
}

或

add_action('woocommerce_before_checkout_billing_form', 'wps_add_date_type_checkout_field');

function wps_add_date_type_checkout_field( $checkout ) {

    woocommerce_form_field( 'billing_date', array(
        'type'          => 'date',
        'class'         => array( 'form-row-wide' ),
        'label'         => __( 'Gender' ),
    ), $checkout->get_value( 'billing_date' ));

}

在订购说明之前（或之后）：

add_action('woocommerce_before_order_notes', 'wps_add_date_type_checkout_field');
// add_action('woocommerce_after_order_notes', 'wps_add_date_type_checkout_field');

function wps_add_date_type_checkout_field( $checkout ) {
    echo '<div id="my_custom_checkout_field">';

    woocommerce_form_field( 'billing_date', array(
        'type'          => 'date',
        'class'        => array('my-field-class form-row-wide'),
        'label'        => __('Date'),
    ), $checkout->get_value( 'billing_date' ));

    echo '</div>';
}

相关文档：Customizing Woocommerce checkout fields using actions and filters

在Woocommerce 3中添加3个结帐选择字段作为复合日期字段

1 个答案: