在WooCommerce后端,我手动为电话客户创建订单,然后向他们发送“ 客户付款页面”链接,以便他们完成付款。
在该页面(带有模板template / checkout / form-pay.php的“订单付款”)上,我添加了以下代码来显示计费表单:
<h3><?php _e( 'Billing details', 'woocommerce' ); ?></h3>
<?php do_action( 'woocommerce_before_checkout_billing_form', $order ); ?>
<div class="woocommerce-billing-fields__field-wrapper">
<?php
$fields = WC()->checkout->get_checkout_fields( 'billing' );
foreach ( $fields as $key => $field ) {
$field_name = $key;
if ( is_callable( array( $order, 'get_' . $field_name ) ) ) {
$field['value'] = $order->{"get_$field_name"}( 'edit' );
} else {
$field['value'] = $order->get_meta( '_' . $field_name );
}
woocommerce_form_field( $key, $field, $field['value'] );
}
?>
</div>
<?php do_action( 'woocommerce_after_checkout_billing_form', $order ); ?>
我希望客户能够修改其帐单信息(姓名,电子邮件,电话,地址),并在付款时将其保存。这是在“常规”结帐页面上使用以下行完成的,但不适用于订单付款端点。
$('body').trigger('update_checkout');
如何在付款时验证并保存这些字段的值(覆盖退出的帐单信息)?
答案 0 :(得分:4)
这是一个多步骤解决方案,但它一直为我工作。
确保已将form-pay.php文件复制到您的子主题(yourtheme / woocommerce / checkout / form-pay.php),这样您就不会丢失所有更新工作。
在form-pay.php的顶部,在define('ABSPATH')||之后添加以下两行代码退出;
$tempateURL = get_stylesheet_directory_uri();
$orderID = wc_get_order_id_by_order_key($_GET["key"]);
接下来,您将在order_review表单内添加结算字段。我在结算表之后但在付款字段之前添加了我的。
<h3><?php _e( 'Billing details', 'woocommerce' ); ?></h3>
<?php do_action( 'woocommerce_before_checkout_billing_form', $order ); ?>
<div class="woocommerce-billing-fields__field-wrapper">
<?php
$fields = WC()->checkout->get_checkout_fields( 'billing' );
foreach ( $fields as $key => $field ) {
$field_name = $key;
if ( is_callable( array( $order, 'get_' . $field_name ) ) ) {
$field['value'] = $order->{"get_$field_name"}( 'edit' );
} else {
$field['value'] = $order->get_meta( '_' . $field_name );
}
woocommerce_form_field( $key, $field, $field['value'] );
}
?>
</div>
然后在结算结束之后创建一个“下一步”按钮,但在结算详细信息关闭之前,如下所示:
<div class="my-button">
<input type="button" id="update-billing" class="button-next" value="Next">
</div>
它看起来像这样:
<h3><?php _e( 'Billing details', 'woocommerce' ); ?></h3>
<?php do_action( 'woocommerce_before_checkout_billing_form', $order ); ?>
<div class="woocommerce-billing-fields__field-wrapper">
<?php
$fields = WC()->checkout->get_checkout_fields( 'billing' );
foreach ( $fields as $key => $field ) {
$field_name = $key;
if ( is_callable( array( $order, 'get_' . $field_name ) ) ) {
$field['value'] = $order->{"get_$field_name"}( 'edit' );
} else {
$field['value'] = $order->get_meta( '_' . $field_name );
}
woocommerce_form_field( $key, $field, $field['value'] );
}
?>
<div class="my-button">
<input type="button" id="update-billing" class="button-next" value="Next">
</div>
</div>
我在子主题中创建了一个js文件夹,并创建了一个名为custom-jquery.js的文件。 我使用以下代码将新的js文件放入我的functions.php中:
add_action( 'wp_enqueue_scripts', 'my_enqueue_assets' );
function my_enqueue_assets() {
wp_enqueue_script( 'my-jquery', get_stylesheet_directory_uri() . '/js/custom-jquery.js',"", false, false );
}
然后我在js文件夹中创建了一个名为woo-functions的文件夹,并创建了一个名为update-cart.php的文件
然后我写了以下代码:
<?php
require_once(rtrim($_SERVER['DOCUMENT_ROOT'], '/') . '/wp-load.php');
print_r($_POST);
$orderID = $_POST["orderID"];
$firstName = $_POST["firstName"];
$lastName = $_POST["lastName"];
$billingCompany = $_POST["billingCompany"];
$billingAddress_1 = $_POST["billingAddress_1"];
$billing_city = $_POST["billing_city"];
$billing_state = $_POST["billing_state"];
$billing_postcode = $_POST["billing_postcode"];
$billing_phone = $_POST["billing_phone"];
$billing_email = $_POST["billing_email"];
update_post_meta( $orderID, '_billing_first_name', $firstName );
update_post_meta( $orderID, '_billing_last_name', $lastName );
update_post_meta( $orderID, '_billing_company', $billingCompany );
update_post_meta( $orderID, '_billing_address_1', $billingAddress_1 );
update_post_meta( $orderID, '_billing_city', $billing_city );
update_post_meta( $orderID, '_billing_state', $billing_state );
update_post_meta( $orderID, '_billing_postcode', $billing_postcode );
update_post_meta( $orderID, '_billing_phone', $billing_phone );
update_post_meta( $orderID, '_billing_email', $billing_email );
echo $firstName;
?>
然后,在单击我创建的“下一步”按钮时,在我的custom-jquery.js文件中编写了以下jquery以更新信息。
jQuery(document).ready(function($) {
$("#update-billing").on("click", function(e){
var stylesheetURL = $("#order_review").attr("data-theme-url");
var orderID = $("#order_review").attr("data-order-id");
var firstName = $("#billing_first_name").val();
var lastName = $("#billing_last_name").val();
var billingCompany = $("#billing_company").val();
var billingAddress_1 = $("#billing_address_1").val();
var billing_city = $("#billing_city").val();
var billing_state = $("#billing_state").val();
var billing_postcode = $("#billing_postcode").val();
var billing_phone = $("#billing_phone").val();
var billing_email = $("#billing_email").val();
console.log(firstName);
$.ajax({
method: "POST",
url: stylesheetURL + "/js/woo-functions/update-cart.php",
data: {
orderID: orderID,
firstName: firstName,
lastName: lastName,
billingCompany: billingCompany,
billingCountry: "US",
billingAddress_1: billingAddress_1,
billing_city: billing_city,
billing_state: billing_state,
billing_postcode: billing_postcode,
billing_phone: billing_phone,
billing_email: billing_email
}
})
.done(function( msg ) {
console.log(msg);
$(".page-id-10 table.shop_table, .page-id-10 .the-payment-fields").slideToggle();
$(".woocommerce-billing-fields__field-wrapper").slideToggle();
});
});
我还添加了一个.slideToggle函数,以在单击“下一步”按钮时隐藏帐单字段。 Woocommerce将信息动态添加到结帐页面,您的常规结帐页面将具有相同的页码。如果您不将slideToggle函数作为唯一类的目标,则它将影响您的正常结帐页面。因此,我在form-pay.php文件中的div ID“ payment”中添加了“ .the-payment-fields”类。
<div id="payment" class="the-payment-fields">
当客户单击“下一步”按钮时,它将数据保存到其个人资料中,您可以在订单上看到帐单信息。
希望这会有所帮助!