php - 如何在产品页面上添加带有价格的单选按钮?WordPress woocommerce
问题描述
如何根据用户的选择自定义产品页面以包含提取费用。在产品页面而不是在结帐页面上自定义您的订单选项,使附加的照片更加简洁。
我有这段代码,它在结账时显示单选按钮和选项,但由于某种原因,费用没有被添加到总数中。
// Part 1
// Display Radio Buttons
// Uses woocommerce_form_field()
add_action( 'woocommerce_before_add_to_cart_form', 'bbloomer_checkout_radio_choice' );
function bbloomer_checkout_radio_choice() {
$chosen = WC()->session->get('radio_chosen');
$chosen = empty( $chosen ) ? WC()->checkout->get_value('radio_choice') : $chosen;
$chosen = empty( $chosen ) ? 'no_option' : $chosen;
$args = array(
'type' => 'radio',
'class' => array( 'form-row-wide' ),
'options' => array(
'no_option' => 'No Option',
'option_1' => 'Option 1 ($10)',
'option_2' => 'Option 2 ($30)',
),
'default' => $chosen
);
echo '<div id="checkout-radio">';
echo '<h3>Customize Your Order!</h3>';
woocommerce_form_field( 'radio_choice', $args, $chosen );
echo '</div>';
}
// Part 2
// Add Fee and Calculate Total
// Based on session's "radio_chosen"
#2 Calculate New Total
add_action( 'woocommerce_cart_calculate_fees', 'bbloomer_checkout_radio_choice_fee', 20, 1 );
function bbloomer_checkout_radio_choice_fee( $cart ) {
if ( is_admin() && ! defined( 'DOING_AJAX' ) ) return;
$radio = WC()->session->get( 'radio_chosen' );
if ( "option_1" == $radio ) {
$fee = 10;
} elseif ( "option_2" == $radio ) {
$fee = 30;
}
$cart->add_fee( __('Option Fee', 'woocommerce'), $fee );
}
// Part 3
// Refresh Checkout if Radio Changes
// Uses jQuery
add_action( 'wp_footer', 'bbloomer_checkout_radio_choice_refresh' );
function bbloomer_checkout_radio_choice_refresh() {
if ( ! is_checkout() ) return;
?>
<script type="text/javascript">
jQuery( function($){
$('form.checkout').on('change', 'input[name=radio_choice]', function(e){
e.preventDefault();
var p = $(this).val();
$.ajax({
type: 'POST',
url: wc_checkout_params.ajax_url,
data: {
'action': 'woo_get_ajax_data',
'radio': p,
},
success: function (result) {
$('body').trigger('update_checkout');
}
});
});
});
</script>
<?php
}
// Part 4
// Add Radio Choice to Session
// Uses Ajax
add_action( 'wp_ajax_woo_get_ajax_data', 'bbloomer_checkout_radio_choice_set_session' );
add_action( 'wp_ajax_nopriv_woo_get_ajax_data', 'bbloomer_checkout_radio_choice_set_session' );
function bbloomer_checkout_radio_choice_set_session() {
if ( isset($_POST['radio']) ){
$radio = sanitize_key( $_POST['radio'] );
WC()->session->set('radio_chosen', $radio );
echo json_encode( $radio );
}
die();
}
如果我将钩子更改为 add_action( 'woocommerce_product_options_general_product_data', 'bbloomer_checkout_radio_choice' );
选项按钮显示在结帐页面上并且工作正常,我假设我需要如何将选项值从产品页面传递到结帐页面
解决方案
添加到以下代码片段以完成您的工作 -
function add_custom_fees_before_add_to_cart() {
global $product;
$args = array(
'type' => 'radio',
'class' => array( 'form-row-wide' ),
'options' => array(
'' => 'No Option',
'10' => 'Option 1 ($10)',
'30' => 'Option 2 ($30)',
),
'default' => ''
);
?>
<div class="custom-fees-wrap">
<label for="iconic-engraving"><?php _e( 'Customize Your Order!', 'textdomain' ); ?></label>
<?php woocommerce_form_field( 'custom_fees', $args, '' ); ?>
</div>
<?php
}
add_action( 'woocommerce_before_add_to_cart_button', 'add_custom_fees_before_add_to_cart', 99 );
function save_value_add_cart_item_data( $cart_item_data, $product_id, $variation_id ) {
$custom_fees = filter_input( INPUT_POST, 'custom_fees' );
if ( empty( $custom_fees ) ) {
return $cart_item_data;
}
$cart_item_data['custom_fees'] = $custom_fees;
return $cart_item_data;
}
add_filter( 'woocommerce_add_cart_item_data', 'save_value_add_cart_item_data', 99, 3 );
function calculate_add_cart_fee() {
global $woocommerce;
$cart_items = $woocommerce->cart->get_cart();
foreach( $cart_items as $key => $item ) {
if( !isset( $item['custom_fees'] ) && empty( $item['custom_fees'] ) ) continue;
$woocommerce->cart->add_fee( __('Custom fees', 'textdomain'), $item['custom_fees'] );
}
}
add_action( 'woocommerce_cart_calculate_fees', 'calculate_add_cart_fee', 99 );
推荐阅读
- python - 使用AJAX将值从html模板传递到Django中的views.py
- c++ - Microsoft NTLM (v2) 中的时间戳使用
- php - 从 MYSQL 数据库回显值到 url
- html - 单独使用 HTML 和 CSS 为每张幻灯片制作两张图片
- string - Perl 无法截断字符串
- powerbi - 如何在 DAX 查询中添加过去 12 个月的 WHERE 条件
- asp.net-mvc - ViewBag 更新不更新视图
- c# - 如何有条件地映射到抽象
- excel - 如何在 Excel 中将列转置为矩阵?
- android - 应用程序因错误 java.lang.IllegalArgumentException 崩溃:布局:-72 < 0