Show custom data in emails, order details woocommerce

Question

Updated:

I'm building a WooCommerce site where the user selects a series of options from dropdowns in the single product page which then display in the cart page and, thanks to help I've received on here, in the checkout as well. The options selected also influence the price of the product. I start with two product variations: 'Print' and 'Original' (the site is selling antique maps).

Everything works fine up till the checkout where all the order details display correctly but, after having placed the order, the details don't appear on the 'order received' screen under 'order details' nor do they appear in the customer confirmation email.

To give some background, the different variations are selected using jQuery, and added to hidden fields a per example below:

$( ":root" ).find("#mapchest-custom-fields").append("<input type='hidden' 
name='test' value='wibble'>");

...and these hidden fields are then referenced to add the details to the cart in the following manner:

add_filter('woocommerce_add_cart_item_data','add_custom_field_data', 20,3);

function add_custom_field_data($cart_item_data, $product_id, $variation_id)
{

    if(isset($_REQUEST['test']) && ! empty( 'test' )) { // not
        $mc_test = sanitize_text_field($_POST['test']);
        $cart_item_data['custom_data']['test'] = array(
            'label' => 'Test',
            'value' => $mc_test
        );
    }

    if(isset($_REQUEST['original_map_vendor_details']) && ! empty( 
    'original_map_vendor_details' )) {
        $mc_original_map_size = 
        sanitize_text_field($_REQUEST['original_map_vendor_details']);
        $cart_item_data['custom_data']['original_map_vendor_details'] = 
        array(
            'label' => 'Vendor',
            'value' => $mc_original_map_size
        );
    }

    // process above repeated for other fields

    return $cart_item_data;
}

The details are displayed in the cart and checkout using the following function:

add_filter('woocommerce_get_item_data','wdm_add_item_meta',10,2);

function wdm_add_item_meta($cart_data, $cart_item)
{

    $custom_items = array();

    if( !empty( $cart_data ) )
    $custom_items = $cart_data;

    if( isset( $cart_item['custom_data'] ) ) {
        foreach( $cart_item['custom_data'] as $key => $custom_data ){
        if( $key != 'key' ){
            $custom_items[] = array(
                'name' => $custom_data['label'],
                'value' => $custom_data['value'],
            );
        }
        }
    }

    return $custom_items;
}

What I want to do, as I say is have the details display in the Order Received page and the emails but I can't make it work. I know that for emails I need to hook it to one of the email hooks but I don't know how to access the data sent to the cart in the function above.

I've tried adding using the woocommerce_checkout_create_order_line_item hook to along these lines:

add_action( 'woocommerce_checkout_create_order_line_item', 
'add_custom_order_line_item_meta', 20,4 );

function add_custom_order_line_item_meta($item, $cart_item_key, $values, 
$order)
{
    if( array_key_exists('test', $values['custom_data']) ){
        $item->update_meta_data( 'Test', $values['custom_data']['test'] );
    }
}

...but whilst I can see the data if I var_dump it in the email like this:

add_action('woocommerce_email_customer_details', 
'add_custom_checkout_field_to_emails_notifications', 25, 4 );

function add_custom_checkout_field_to_emails_notifications( $order, 
$sent_to_admin, $plain_text, $email ) {
    var_dump($order);
}

So, in summary, I have the data working and displaying up to the point of the checkout. After that, I want it to display in customer confirmation emails and on the 'order received' page but I'm having trouble accessing the data. Having looked through other questions on the same subject i would have thought that this would happen automatically regarding the order received page but it doesn't. I suspect there's a stage missing in the code but I can't work out what it should be.

Any tips as to what I'm doing wrong here?

Thanks in advance.

ps. I've now managed to display the fields in the confirmation email (after a fashion) using the following functions:

add_action( 'woocommerce_checkout_create_order_line_item', 
'add_custom_order_line_item_meta', 20,4 );

function add_custom_order_line_item_meta($item, $cart_item_key, $values, 
$order)
{

    if ( isset( $values['custom_data'] ) ) {
        $item->update_meta_data( __('The Custom Data', 'woocommerce'), 
        $values['custom_data'] );          
   }
}

and

add_action('woocommerce_email_customer_details', 
'add_custom_checkout_field_to_emails_notifications', 25, 4 );

function add_custom_checkout_field_to_emails_notifications( $order, 
$sent_to_admin, $plain_text, $email ) {
// var_dump($order);
  foreach( $order->get_items() as $item_id => $item ){

    $custom_data = $item->get_meta( 'The Custom Data' );

    foreach( $custom_data as $key => $value ){

      foreach( $value as $key1 => $value1 ){
        $output = '';
        $output .= '<span class="text">' . $value1  . '</span>';
        echo $output;
      }
      echo "<br>";
    }

    echo "<br><br>";
    // var_dump($custom_data );

  }
  '</strong> <span class="text">' . $order->get_data() . '</span></div>';
}

but this is a hacky solution and doesn't address the underlying problem of why the information isn't appearing in the order received page or directly in the order line items in the email.

Answer 1

Okay, I've worked this out. I'm putting the answer here for the benefit of anyone else having the same problem. Basically, my process was missing a stage. In order to achieve the above you do as follows:

1. Define the value you wish to pass as meta data. In my own case I used a hidden field but this can equally be set with a text input, a dropdown or other input field. In my case I used jquery to append this to an empty div with id 'mapchest-custom-fields' which I hooked into the process before the cart button. It can equally be set with a static value.

   <?php
   function define_container_div() {
   ?>  
   <div id="mapchest-custom-fields"></div>
   <?php
   } 
   
   add_action( 'woocommerce_before_add_to_cart_button', 'define_container_div', 20 );
   ?>
   

   ...jQuery code to append the value. Value can be dynamic as well:

   $( ":root" ).find("#mapchest-custom-fields").append("<input type='hidden' name='test' value='wibble'>");
   

2. Next you add the value to your cart item data:

   function add_values_to_cart_item_data( $cart_item_data, $product_id, $variation_id ) 
   {
       if(isset($_POST['test']) && ! empty( 'test' )) {
           $test = filter_input( INPUT_POST, 'test' );
           $cart_item_data['test'] = $test;
       }
   
       return $cart_item_data;
   }
   
   add_filter( 'woocommerce_add_cart_item_data', 'add_values_to_cart_item_data', 10, 3);
   

3. Next, you display the value in your cart:

   function display_data_in_cart( $item_data, $cart_item ) {
   
       $item_data[] = array(
           'key'     => __( 'Test', 'mapchest' ),
           'value'   => wc_clean( $cart_item['test'] ),
       );
   
       return $item_data;
   }
   
   add_filter( 'woocommerce_get_item_data', 'display_data_in_cart', 10, 2 );
   

4. And finally, you add the data to your order items:

   function add_data_to_order_items( $item, $cart_item_key, $values, $order ) {
   
       $item->add_meta_data( __( 'Test', 'mapchest' ), $values['test'] );
   }
   
   add_action( 'woocommerce_checkout_create_order_line_item', 'add_data_to_order_items', 10, 4 );
   

The above process works for me. It displays the custom data in the cart and in the checkout and persists it through to the 'Order Received' page archived orders and the confirmation email (not checked other emails yet).

Thanks to https://iconicwp.com/blog/add-custom-cart-item-data-woocommerce/ for explaining this process to me.