CODEWITHSUNDEEP
wordpresswoocommerce
user1048676
user1048676

Reputation: 10066

Adding a datepicker to Woocommerce Checkout Page

I'd like to add a custom field to my billing checkout page in Woocommerce. I'd like it to be a birthday field and have them select it from the datepicker. How do I enable this functionality within wordpress?

Upvotes: 2

Views: 9893

Answers (1)

Atif Tariq
Atif Tariq

Reputation: 2772

Please add this in your theme's functions.php file:

<?
// ADD Custom Fields to Checkout Page
/**
 * Add the field to the checkout
 **/

add_action('woocommerce_after_order_notes', 'my_custom_checkout_field');

function my_custom_checkout_field( $checkout ) {

    date_default_timezone_set('America/Los_Angeles');
    $mydateoptions = array('' => __('Select BirthDay', 'woocommerce' )); 

    echo '<div id="my_custom_checkout_field"><h3>'.__('Delivery Info').'</h3>';

   woocommerce_form_field( 'order_birth_date', array(
        'type'          => 'text',
        'class'         => array('my-field-class form-row-wide'),
        'id'            => 'datepicker',
        'required'      => true,
        'label'         => __('Delivery Date'),
        'placeholder'       => __('Select Date'),
        'options'     =>   $mydateoptions
        ),$checkout->get_value( 'order_birth_date' ));

    echo '</div>';
}

/**
 * Process the checkout
 **/
add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');

function my_custom_checkout_field_process() {
    global $woocommerce;

    // Check if set, if its not set add an error.
    if (!$_POST['order_birth_date'])
         wc_add_notice( '<strong>BirthDay</strong> ' . __( 'is a required field.', 'woocommerce' ), 'error' );
}

/**
 * Update the order meta with field value
 **/
add_action('woocommerce_checkout_update_order_meta', 'my_custom_checkout_field_update_order_meta');

function my_custom_checkout_field_update_order_meta( $order_id ) {
    if ($_POST['order_birth_date']) update_post_meta( $order_id, 'BirthDay', esc_attr($_POST['order_birth_date']));
}
?>

Upvotes: 4

Related Questions