自定义下拉选择显示或隐藏其他结帐的自定义字段
我用这个代码来创建自定义结账字段和重新排序字段:自定义下拉选择显示或隐藏其他结帐的自定义字段
add_filter('woocommerce_checkout_fields', 'custom_checkout_billing_fields'); function custom_checkout_billing_fields($fields) {
// 1. Creating the additional custom billing fields
// The "status" selector
$fields['billing']['billing_status']['type'] = 'select';
$fields['billing']['billing_status']['class'] = array('form-row-wide, status-select');
$fields['billing']['billing_status']['required'] = true;
$fields['billing']['billing_status']['label'] = __('User status', 'my_theme_slug');
$fields['billing']['billing_status']['placeholder'] = __('Chose an option', 'my_theme_slug');
$fields['billing']['billing_status']['options'] = array(
'' => 'Chose an option',
'1' => 'Legal entity',
'2' => 'Individual'
);
// The "Serial ID" text field
$fields['billing']['billing_number_id']['type'] = 'text';
$fields['billing']['billing_number_id']['class'] = array('form-row-wide', 'status-group1');
$fields['billing']['billing_number_id']['required'] = true;
$fields['billing']['billing_number_id']['label'] = __('Serial ID', 'my_theme_slug');
$fields['billing']['billing_number_id']['placeholder'] = __('Enter your Serial ID', 'my_theme_slug');
// Customizing 'billing_company' field ['required']
$fields['billing']['billing_company']['required'] = false;
// The "Serial ID" text field
$fields['billing']['billing_serial']['type'] = 'text';
$fields['billing']['billing_serial']['class'] = array('form-row-wide', 'status-group1');
$fields['billing']['billing_serial']['required'] = false;
$fields['billing']['billing_serial']['label'] = __('Serial ID', 'my_theme_slug');
$fields['billing']['billing_serial']['placeholder'] = __('Enter your Serial ID', 'my_theme_slug');
// 2. Customizing 'billing_email' and 'billing_phone' fields ['class']
$fields['billing']['billing_email']['class'] = array('form-row-first', 'status-group1');
$fields['billing']['billing_phone']['class'] = array('form-row-last', 'status-group1');
// 3. Ordering the billing fields
$fields_order = array(
'billing_first_name', 'billing_last_name', 'billing_email',
'billing_phone', 'billing_address_1', 'billing_address_2',
'billing_postcode', 'billing_city', 'billing_country',
'billing_status',
'billing_company', 'billing_number_id', 'billing_serial'
);
foreach($fields_order as $field) $ordered_fields[$field] = $fields['billing'][$field];
$fields['billing'] = $ordered_fields;
// Returning Checkout customized billing fields
return $fields;
}
有条件的机制:
- 默认情况下,
billing_status
下拉选择器将在Individual
期权价值和将显示只有billing_serial
自定义字段。 - 当
billing_status
下拉选择将切换到"Company"
**的选项值,2个更多的字段将出现:billing_company
现有场(前billing_serial
)billing_number_id
自定义字段(在结束)
我该如何做到这一点?
由于
参考:WooCommerce - Checkout conditional fields for different persons custom status
回答:
对于WooCommerce 3+ (更新):
由于WooCommerce 3.0结帐字段已经改变一点点,从而不可能将字段重新排序为befo回覆。
有一个新的“优先”说法该处理场订购,用于结帐领域和我的帐户领域也是如此。
下面我只更新部分相关订货领域:
## 3. Ordering the billing fields // Set the order of the fields
$billing_fields_new_order = array(
'billing_first_name', 'billing_last_name', 'billing_email',
'billing_phone', 'billing_address_1', 'billing_address_2',
'billing_postcode', 'billing_city', 'billing_country',
'billing_status',
'billing_company', 'billing_number_id', 'billing_ser_id'
);
$count = 0;
$priority = 10;
// Updating the 'priority' argument
foreach($billing_fields_new_order as $field_name){
$count++;
$fields['billing'][$field_name]['priority'] = $count * $priority;
}
// END: returning the customized checkout fields
return $fields;
参考:Reordering checkout fields in WooCommerce 3
原来的答复:
这里是一个解决方案用jQu使用条件机制工作正如你所期望的... ...的PHP代码是完成了一些必要的功能...
PHP代码(进入功能。PHP):
// Registering external jQuery/JS file function cfields_scripts() {
/* IMPORTANT NOTE: For a child theme replace get_template_directory_uri() by get_stylesheet_directory_uri()
The external cfields.js file goes in a subfolder "js" of your active child theme or theme.*/
wp_enqueue_script('checkout_script', get_template_directory_uri().'/js/cfields.js', array('jquery'), '1.0', true);
}
add_action('wp_enqueue_scripts', 'cfields_scripts');
add_filter('woocommerce_checkout_fields', 'custom_checkout_billing_fields');
function custom_checkout_billing_fields($fields) {
// 1. Creating the additional custom billing fields
// The "status" selector
$fields['billing']['billing_status']['type'] = 'select';
$fields['billing']['billing_status']['class'] = array('form-row-wide, status-select');
$fields['billing']['billing_status']['required'] = true;
$fields['billing']['billing_status']['label'] = __('User status', 'my_theme_slug');
$fields['billing']['billing_status']['placeholder'] = __('Chose an option', 'my_theme_slug');
$fields['billing']['billing_status']['options'] = array(
'1' => __('Individual', ''),
'2' => __('Company', '')
);
// Customizing 'billing_company' field ['required']
$fields['billing']['billing_company']['required'] = false;
$fields['billing']['billing_company']['class'] = array('form-row-wide', 'status-group2');
// The "Number ID" text field
$fields['billing']['billing_number_id']['type'] = 'text';
$fields['billing']['billing_number_id']['class'] = array('form-row-wide');
$fields['billing']['billing_number_id']['required'] = true;
$fields['billing']['billing_number_id']['label'] = __('Number ID', 'my_theme_slug');
$fields['billing']['billing_number_id']['placeholder'] = __('Enter your Number ID', 'my_theme_slug');
// The "Serial identification" text field
$fields['billing']['billing_ser_id']['type'] = 'text';
$fields['billing']['billing_ser_id']['class'] = array('form-row-wide', 'status-group2');
$fields['billing']['billing_ser_id']['required'] = false;
$fields['billing']['billing_ser_id']['label'] = __('Serial identification', 'my_theme_slug');
$fields['billing']['billing_ser_id']['placeholder'] = __('Enter your Serial identification', 'my_theme_slug');
// 3. Ordering the billing fields
$fields_order = array(
'billing_first_name', 'billing_last_name', 'billing_email',
'billing_phone', 'billing_address_1', 'billing_address_2',
'billing_postcode', 'billing_city', 'billing_country',
'billing_status',
'billing_company', 'billing_number_id', 'billing_ser_id'
);
foreach($fields_order as $field) $ordered_fields[$field] = $fields['billing'][$field];
$fields['billing'] = $ordered_fields;
// Returning Checkout customized billing fields
return $fields;
}
// Process the checkout
add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');
function custom_checkout_field_process() {
// Check if set, if its not set add an error.
if (! $_POST['billing_number_id'])
wc_add_notice(__('Please enter your Number ID.', 'my_theme_slug'), 'error');
if (! $_POST['billing_ser_id'])
wc_add_notice(__('Please enter your Serial id.' , 'my_theme_slug'), 'error');
}
// Update the order meta with field value
add_action('woocommerce_checkout_update_order_meta', 'custom_checkout_field_update_order_meta');
function custom_checkout_field_update_order_meta($order_id) {
if (! empty($_POST['billing_number_id']))
update_post_meta($order_id, 'billing_number_id', sanitize_text_field($_POST['billing_number_id']));
if (! empty($_POST['billing_ser_id']))
update_post_meta($order_id, 'billing_ser_id', sanitize_text_field($_POST['billing_ser_id']));
}
// Display field value on the order edit page
add_action('woocommerce_admin_order_data_after_billing_address', 'custom_checkout_field_display_admin_order_meta', 10, 1);
function custom_checkout_field_display_admin_order_meta($order){
echo '<p><span>'.__('My number ID').':</span> ' . get_post_meta($order->id, 'billing_number_id', true) . '</p>';
echo '<p><span>'.__('My serial identification').':</span> ' . get_post_meta($order->id, 'billing_ser_id', true) . '</p>';
}
的Javascript cfields.js
代码(外部文件):
// This file named "cfields.js" goes in a subfolder "js" of your active child theme or theme jQuery(document).ready(function($){
$('#billing_company_field').hide(function(){
$(this).removeClass("validate-required");
});
$('#billing_ser_id_field').hide(function(){
$(this).removeClass("validate-required");
});
$("#billing_number_id_field").addClass("validate-required");
$("#billing_status").change(function(){
if($("#billing_status option:selected").val() == "2"){
$('#billing_company_field').show(function(){
$(this).addClass("validate-required");
});
$('#billing_ser_id_field').show(function(){
$(this).addClass("validate-required");
});
} else if($("#billing_status option:selected").val() == "1"){
$('#billing_company_field').hide(function(){
$(this).removeClass("validate-required");
});
$('#billing_ser_id_field').hide(function(){
$(this).removeClass("validate-required");
});
}
});
});
所有这些代码已经被测试和工程
以上是 自定义下拉选择显示或隐藏其他结帐的自定义字段 的全部内容, 来源链接: utcz.com/qa/262219.html