在 woocommerce_review_order_before_submit 中显示自定义字段

Question

我有一个使用以下代码创建的自定义结帐字段：

add_action( 'woocommerce_before_order_notes', 'add_custom_checkout_field' );
function add_custom_checkout_field( $checkout ){
  woocommerce_form_field( 'number_id', array(        
    'type' => 'number',        
    'class' => array( 'form-row-wide' ),        
    'label' => 'Amount',        
    'placeholder' => 'Place your number here',        
    'required' => false,              
   ),  $checkout->get_value( 'number_id' ) ); 
}

我希望此字段显示在下订单按钮之前的空间中。我尝试执行以下操作，但没有成功：

    add_action( 'woocommerce_review_order_before_submit', 'review_order_before_submit_state_message' );
    function review_order_before_submit_state_message() {
        $amount = WC()->session->get('number_id');
        $message = "Amount you entered is: <strong>".$amount;
            echo '<ul class="woocommerce-info">'.$message.'</ul>';
    }

这个金额也可以根据客户的输入而改变，所以也尝试了 javascript，但购物车没有刷新：

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=number_id]', 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
}
// WP Ajax Function
add_action( 'wp_ajax_woo_get_ajax_data', 'woo_get_ajax_data' ); 
add_action( 'wp_ajax_nopriv_woo_get_ajax_data', 'woo_get_ajax_data' ); 
function woo_get_ajax_data() { 
    if ( isset($_POST['number_id']) ){ 
        $number_id = sanitize_key( $_POST['number_id'] ); 
        WC()->session->set('number_id', $number_id ); 
        echo json_encode( $number_id ); 
    } 
    die(); 
} 

谁能告诉我我做错了什么？谢谢。

更新

add_action( 'wp_ajax_woo_get_ajax_data', 'woo_get_ajax_data' ); 
add_action( 'wp_ajax_nopriv_woo_get_ajax_data', 'woo_get_ajax_data' ); 
function woo_get_ajax_data() { 
if ( isset($_POST['number_id']) ){ 
$number_id = sanitize_key( $_POST['number_id'] ); 
WC()->session->set('number_id', $number_id ); 
echo json_encode( $number_id ); 
} 
die(); 
}

Answer 1

我已经解决了这个问题。感谢大家的贡献：

    /*
    This code adds a custom field in shipping on checkout that lets the customer add their amount which gets displayed in the review order box
*/
// Add a custom input field to be displayed on checkout
add_action( 'woocommerce_before_checkout_shipping_form', 'checkout_shipping_form_cod_addition', 20 );
function checkout_shipping_form_cod_addition( ) {
    $domain = 'woocommerce';

    $customer_cod   = WC()->session->get('cod_input');

    // Add a custom input number field
    woocommerce_form_field( 'cod_input', array(
        'type'      => 'number',
        'class'     => array( 'form-row-wide' ),
        'label' => 'Amount to be charged to customers',
        'placeholder' => 'COD',        
        'required'  => false,
    ), $customer_cod );


}



// jQuery - Ajax script - to refresh checkout
add_action( 'wp_footer', 'checkout_shipping_cod_script' );
function checkout_shipping_cod_script() {
    // Only checkout page
    //if ( is_checkout() && ! is_wc_endpoint_url() ) :
if ( ! is_checkout() ) return;
    WC()->session->__unset('cod_input');
    ?>
    <script type="text/javascript">
    jQuery( function($){
        $('form.checkout').on('change', 'input#cod_input', function(){
            var p = $(this).val();
            console.log(p);
            $.ajax({
                type: 'POST',
                url: wc_checkout_params.ajax_url,
                data: {
                    'action': 'woo_get_ajax_data',
                    'cod': p,
                },
                success: function (result) {
                    $('body').trigger('update_checkout');

                },

            });
        });
    });
    </script>
    <?php
    //endif;
}

// Php Ajax (Receiving request and saving to WC session)
add_action( 'wp_ajax_woo_get_ajax_data', 'woo_get_ajax_data' );
add_action( 'wp_ajax_nopriv_woo_get_ajax_data', 'woo_get_ajax_data' );
function woo_get_ajax_data() {
    if ( isset($_POST['cod']) ){
        $cod = sanitize_key( $_POST['cod'] );
        WC()->session->set('cod_input', $cod );
        echo json_encode( $cod );
    }
    die(); // Alway at the end (to avoid server error 500)
}



//Add the output to the review order box
add_action( 'woocommerce_review_order_before_submit', 'review_order_before_submit_state_message' );
function review_order_before_submit_state_message() {
   global $woocommerce;
    $customer_cod = WC()->session->get( 'cod_input' ); // Dynamic cod
    $total_amount = floatval( preg_replace( '#[^\d.]#', '', WC()->cart->get_cart_contents_total() ) );
    $shipping = floatval( preg_replace( '#[^\d.]#', '', WC()->cart->get_shipping_total( )) );
    $profit = $customer_cod-$total_amount-$shipping;


   $cod_message = "COD amount is: <strong>Rs. ".$customer_cod."</strong>";
   $profit_message = "Your Profit is: <strong>Rs. ".$profit."</strong>";

           if ( !empty( $customer_cod) ) {
           echo '<ul class="cod-info">'.'<li>'.$cod_message.'</li>'.'<li>'.$profit_message.'</li>'.'</ul>';
           }
}

//saves the new checkout field
    add_action( 'woocommerce_checkout_update_order_meta', 'save_cod_amount' );

    function save_cod_amount( $order_id ) { 
        if ( $_POST['cod_input'] ) update_post_meta( $order_id, 'cod_input', esc_attr( $_POST['cod_input'] ) );
    }
//adds the new checkout field value to the admin order that can be edited
    add_action( 'woocommerce_admin_order_data_after_shipping_address', 'show_new_checkout_field_in_shopping_order', 10, 1 );

    function show_new_checkout_field_in_shopping_order( $order ) {    
    $order_id = $order->get_id();
    $cod_input = get_post_meta( $order->id, 'cod_input', true );

?>
<div class="address">
    <p<?php if( empty($cod_input) ) echo ' class="none_set"' ?>>
         <strong>COD Amount:</strong>
        <?php echo ( !empty( $cod_input ) ) ? $cod_input : '-' ?>
    </p>
</div>
<div class="edit_address"><?php
    woocommerce_wp_text_input( array( 
        'id' => 'cod_input',
        'label' => 'COD amount', 
        'wrapper_class' => 'form-field-wide',
        'value' => $cod_input,) );
?></div>

    <?php

    }

//if this field is altered then it needs to be saved
    add_action( 'woocommerce_process_shop_order_meta', 'save_cod_input' );

    function save_cod_input( $ord_id ){
        update_post_meta( $ord_id, 'cod_input', wc_clean( $_POST[ 'cod_input' ] ) );
    }
/* End of this code */