Woocommerce Change Checkout Total on Checkout Page

Question

I've got a Wordpress site on which I'm running the WooCommerce plugin. On the checkout page, the client has asked for a dropdown list of villages that they deliver to, and has asked for the delivery charge to be applied to the order. So the person ordering the item would choose the item, go to checkout, enter their address, select their village from a dropdown upon which the order total would be changed and then pay the changed order total.

My code at the moment is below and only adds the dropdown box to the order. All this code is being added from a custom plugin file.

add_filter( 'woocommerce_checkout_fields' , 'town_dropdown' );
add_action('woocommerce_checkout_process', 'check_if_town_set');

function town_dropdown($fields) {
$fields['billing']['town_dropdown'] = array(
    'type'          => 'select',
    'class'         => array('form-row-wide'),
    'label'         => '<div id="town-drop"><h2>Delivery Charge</h2><p>We deliver to the villages in the dropdown below. Please choose a village to have the correct price applied to your order.</p><br>',
    'options'     => array(
        '0' => 'Please select a delivery charge',
        '3.50-lin' => 'Linton -  £3.50',
        '5.00-abi' => 'Gt & Lt Abington - £5.00',
        '6.00-bab' => 'Babraham - £6.00', 
        '5.00-bal' => 'Balsham - £5.00', 
        '5.00-bar' => 'Bartlow - £5.00', 
        '8.00-bri' => 'Brinkley - £8.00', 
        '8.00-bur' => 'Burrough Green - £8.00', 
        '8.00-cam' => 'Cambridge - £8.00', 
        '5.00-card' => 'Cardinals Green - £5.00', 
        '8.00-carl' => 'Carlton - £8.00', 
        '6.00-cas' => 'Castle Camps - £6.00', 
        '8.00-che' => 'Cherry Hinton - £8.00',
        '6.00-dux' => 'Duxford - £6.00', 
        '8.00-ful' => 'Fulbourn - £8.00', 
        '5.00-had' => 'Hadstock - £5.00', 
        '8.00-hav' => 'Haverhill - £8.00', 
        '8.00-hel' => 'Helions Bumpstead - £8.00', 
        '8.00-hem' => 'Hempstead - £8.00', 
        '5.00-hil' => 'Hildersham - £5.00', 
        '8.00-hix' => 'Hinxton - £8.00', 
        '5.00-hor' => 'Horseheath - £5.00', 
        '8.00-ick' => 'Ickleton - £8.00', 
        '8.00-ked' => 'Kedington - £8.00', 
        '8.00-litb' => 'Littlebury - £8.00', 
        '6.00-litw' => 'LittleWalden - £6.00', 
        '6.00-rad' => 'Radwinter - £6.00', 
        '8.00-saf' => 'Saffron Walden - £8.00', 
        '8.00-sam' => 'Gt &amp; Lt Sampford - £8.00', 
        '6.00-saw' => 'Sawston - £6.00', 
        '8.00-sew' => 'Sewards End - £8.00', 
        '8.00-she' => 'Shelfords - £8.00', 
        '8.00-ste' => 'Steeple Bumpstead - £8.00', 
        '6.00-str' => 'Streetly End - £6.00', 
        '8.00-thu' => 'Thurlow - £8.00', 
        '6.00-wwi' => 'West Wickham - £6.00', 
        '6.00-wwa' => 'West Wratting - £6.00', 
        '6.00-wco' => 'Weston Colville - £6.00', 
        '8.00-wgr' => 'Weston Green - £8.00', 
        '8.00-whi' => 'Whittlesford - £8.00', 
        '8.00-wil' => 'Gt &amp; Lt Wilbraham - £8.00', 
        '6.00-wit' => 'Withersfield - £6.00', 
        '8.00-wra' => 'Gt &amp; Lt Wratting - £8.00', 
    )
);
return $fields;
}

function check_if_town_set() {
    if (!$_POST['town_dropdown'])
        if ($_POST['town_dropdown'] == 0)
            wc_add_notice( __('Please select a shipping charge'), 'error' );
}

The box looks like this at the moment:

To summarise, my questions are:

1) Is there a function to update the checkout total on the checkout page?

2) How would I call this function? Is it possible to call on the select OnChange event? If not could I add a button below the delivery charge box to call the function?

Please question me more, I'm sure I've got something wrong as it's my first time with the Wordpress Plugin API - And thanks for any and all replies.

Answer 1

Solved - Here's how. Added a button and a dropdown allowing customers to add the shipping as a product to the cart, here's the code.

add_filter( 'woocommerce_after_order_notes' , 'town_dropdown' );

function town_dropdown($checkout) {
    echo '<div id="town-drop">
    <h2>Delivery Charge</h2>
    <p>We deliver to the villages in the dropdown below. Please choose a village to have the correct price applied to your order. <strong>You must have the correct delivery price added, or your order will not be shipped!</strong></p>';
    echo '<script>
    function AddProductToCart() {
        product = document.getElementById("town_dropdown").value;
        productid = product.split("-");
        window.location = "http://site-url.com/checkout/?add-to-cart="+productid[0];
    }
    </script>';
    woocommerce_form_field( 'town_dropdown', array(
        'type'          => 'select',
        'class'         => array('form-row-wide'),
        'label'         => '',
        'options'     => array(
            '0' => 'Please select a delivery charge',
            '2458-lin' => 'Linton -  £3.50',
            '2468-abi' => 'Gt & Lt Abington - £5.00',
            '2470-bab' => 'Babraham - £6.00', 
            '2468-bal' => 'Balsham - £5.00', 
            '2468-bar' => 'Bartlow - £5.00', 
            '2471-bri' => 'Brinkley - £8.00', 
            '2471-bur' => 'Burrough Green - £8.00', 
            '2471-cam' => 'Cambridge - £8.00', 
            '2468-card' => 'Cardinals Green - £5.00', 
            '2471-carl' => 'Carlton - £8.00', 
            '2470-cas' => 'Castle Camps - £6.00', 
            '2471-che' => 'Cherry Hinton - £8.00',
            '2470-dux' => 'Duxford - £6.00', 
            '2471-ful' => 'Fulbourn - £8.00', 
            '2468-had' => 'Hadstock - £5.00', 
            '2471-hav' => 'Haverhill - £8.00', 
            '2471-hel' => 'Helions Bumpstead - £8.00', 
            '2471-hem' => 'Hempstead - £8.00', 
            '2468-hil' => 'Hildersham - £5.00', 
            '2471-hix' => 'Hinxton - £8.00', 
            '2468-hor' => 'Horseheath - £5.00', 
            '2471-ick' => 'Ickleton - £8.00', 
            '2471-ked' => 'Kedington - £8.00', 
            '2471-litb' => 'Littlebury - £8.00', 
            '2470-litw' => 'Little Walden - £6.00', 
            '2470-rad' => 'Radwinter - £6.00', 
            '2471-saf' => 'Saffron Walden - £8.00', 
            '2471-sam' => 'Gt &amp; Lt Sampford - £8.00', 
            '2470-saw' => 'Sawston - £6.00', 
            '2471-sew' => 'Sewards End - £8.00', 
            '2471-she' => 'Shelfords - £8.00', 
            '2471-ste' => 'Steeple Bumpstead - £8.00', 
            '2470-str' => 'Streetly End - £6.00', 
            '2471-thu' => 'Thurlow - £8.00', 
            '2470-wwi' => 'West Wickham - £6.00', 
            '2470-wwa' => 'West Wratting - £6.00', 
            '2470-wco' => 'Weston Colville - £6.00', 
            '2471-wgr' => 'Weston Green - £8.00', 
            '2471-whi' => 'Whittlesford - £8.00', 
            '2471-wil' => 'Gt &amp; Lt Wilbraham - £8.00', 
            '2470-wit' => 'Withersfield - £6.00', 
            '2471-wra' => 'Gt &amp; Lt Wratting - £8.00', 
            )
        ),$checkout->get_value('town_dropdown')
    );
    echo '<button type="button" OnClick="AddProductToCart()">Add Shipping</button>';
    echo '</div>';
}

On the button click, the Javascript redirects to a page that adds the product to the cart, by using the first part of the select value as the product id (The reason why this was necessary was that PHP arrays cannot have multiple elements with the same identifier). Hope this helps someone - comment with q's if you have them.